console
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>EXIF</title>
</head>
<body>
项目地址：https://github.com/exif-js/exif-js
<input id="file-input" type="file" accept="image/*" capture="camera" />
<script src="https://cdn.jsdelivr.net/npm/exif-js"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=fUtTcAgWYXI5t53TTodmT1X89XiMcQYf"></script>
<script>
function getPosition(lat, lng) {
const point = new BMapGL.Point(parseFloat(lng), parseFloat(lat))
new BMapGL.Geocoder().getLocation(point, function (rs) {
if (rs){
console.log(rs.address);
}
});
}
document.getElementById("file-input").onchange = function (e) {
const file = e.target.files[0];
if (file && file.name) {
EXIF.getData(file, function () {
const exifData = EXIF.getAllTags(this);
if (exifData) {
console.log(EXIF.pretty(this));
console.log("设备型号", exifData.Make);
console.log("拍照时间", exifData.DateTimeDigitized);
console.log(
"纬度",
exifData.GPSLatitudeRef,
exifData.GPSLatitude
);
console.log(
"经度",
exifData.GPSLongitudeRef,
exifData.GPSLongitude
);
try {
if (
exifData.GPSLatitudeRef &&
exifData.GPSLatitude &&
exifData.GPSLatitude[0] &&
exifData.GPSLatitude[1] &&
exifData.GPSLatitude[2] &&
exifData.GPSLongitudeRef &&
exifData.GPSLongitude &&
exifData.GPSLongitude[0] &&
exifData.GPSLongitude[1] &&
exifData.GPSLongitude[2]
) {
console.log(
exifData.GPSLatitudeRef,
exifData.GPSLatitude,
exifData.GPSLatitude[0],
exifData.GPSLatitude[1],
exifData.GPSLatitude[2]
);
const lat =
(exifData.GPSLatitudeRef === "S" ? "-" : "") +
(exifData.GPSLatitude[0]+exifData.GPSLatitude[1]/60.0+exifData.GPSLatitude[2]/3600.0);
const lng =
(exifData.GPSLongitude === "W" ? "-" : "") +
(exifData.GPSLongitude[0]+exifData.GPSLongitude[1]/60.0+exifData.GPSLongitude[2]/3600.0);
console.log("经纬度", lat, lng);
getPosition(lat, lng);
}
} catch (e) {
console.log("错误", e);
}
} else {
console.log("No EXIF data found in image '" + file.name + "'.");
}
});
}
};
</script>
</body>
</html>