| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
- <title>EXIF example with inline EXIF info</title>
- </head>
- <body>
- <img src="DSCN0614_small.jpg" id="img1" />
- <pre>Make and model: <span id="makeAndModel"></span></div>
- <br/>
- <img src="Bush-dog.jpg" id="img2" />
- <pre id="allMetaDataSpan"></pre>
- <br/>
- <img src="Bloated-Hero.jpg" id="img3" /><br/>
- <pre id="img3WithXmpMetaData"></pre>
- <script type="text/javascript" src="../exif.js"></script>
- <script>
- "use strict";
- window.onload=getExif;
- function getExif() {
- var img1 = document.getElementById("img1");
- EXIF.getData(img1, function() {
- var make = EXIF.getTag(this, "Make");
- var model = EXIF.getTag(this, "Model");
- var makeAndModel = document.getElementById("makeAndModel");
- makeAndModel.innerHTML = `${make} ${model}`;
- });
- var img2 = document.getElementById("img2");
- EXIF.getData(img2, function() {
- var allMetaData = EXIF.getAllTags(this);
- var allMetaDataSpan = document.getElementById("allMetaDataSpan");
- allMetaDataSpan.innerHTML = JSON.stringify(allMetaData, null, "\t");
- });
- var img3 = document.getElementById("img3");
- // EXIF.enableXmp();
- EXIF.getData(img3, function() {
- var allMetaData = EXIF.getAllTags(this);
- var img3WithXmpMetaData = document.getElementById("img3WithXmpMetaData");
- img3WithXmpMetaData.innerHTML = JSON.stringify(allMetaData, null, "\t");
- });
- }
- </script>
- </body>
- </html>
|