我目前正在建立一个允许用户将图片加载到预览区域的网站,然后他们可以按一个按钮以显示EXIF信息。
我正在使用exif.js库通过名为“ getExif”的函数来完成这项工作...
目前,它确实可以正常工作...用户加载图片,并在按下“加载历史记录”按钮时显示EXIF信息。在这种情况下,我通过获取GPS信息显示了iFrame地图,并将捕获位置显示为“标记”,此外,我还显示了所用相机的制造商和型号以及捕获的日期和时间。 / p>
它看起来像这样:
“问题”是:
有些图片只有一些EXIF信息,而根本没有...
我想将getExif函数修改为在没有特定EXIF信息的情况下显示为“ No exif info”或“无信息” ...
目前,仅当我要显示的所有信息都在图片中时,它才起作用。
如果我尝试使用在右侧显示所有信息但没有GPS协调的图像,则根本无法使用...不会显示任何信息...
因此,如果缺少一些EXIF信息,我应该如何修改下面的代码以至少显示某种警报?
(最好是像我之前描述的那样对每个信息元素进行测试...)
// Funções para converter a latitude e longitude para um valor legível pelo Google Maps
// Neste caso está a passar de "Degrees Minutes Seconds" (DMS) para decimal
var toDecimal = function (number) {
var d = number[0];
var m = number[1];
var s = number[2];
var dms= (d+(m/60+s/3600)).toFixed(6);
return dms;
};
var toDecimal_Neg = function (number) {
var d = number[0];
var m = number[1];
var s = number[2];
var dms= (d+(m/60)+s/3600).toFixed(6);
var dms_neg=-Math.abs(dms);
return dms_neg;
};
link_mapa = document.getElementById("link");
botao = document.getElementById("show_exif");
botao.onclick=getExif;
function getExif() {
img1 = document.getElementById("img1");
EXIF.getData(img1, function() {
// Criação das variáveis e atribuição de valores às mesmas
marca = EXIF.getTag(this, "Make"); // Fabricante da câmara
modelo = EXIF.getTag(this, "Model"); // Modelo da câmara
data_hora = EXIF.getTag(this, "DateTimeOriginal") // Data e hora de captura da foto
latitude = EXIF.getTag(this, "GPSLatitude"); // latitude
longitude = EXIF.getTag(this, "GPSLongitude"); // longitude
latitude_POS = EXIF.getTag(this, "GPSLatitudeRef"); // Norte ou Sul --> Consequentemente será positiva ou negativa
longitude_POS = EXIF.getTag(this, "GPSLongitudeRef"); // Este ou Oeste --> Consequentemente será positiva ou negativa
// Elementos presentes no código HTML onde se vai apresentar a informação do EXIF através das variáveis criadas acima
marca_tag = document.getElementById("marca");
modelo_tag = document.getElementById("modelo");
data_hora_tag = document.getElementById("data_hora");
local_lat = document.getElementById("local_lat");
local_lon = document.getElementById("local_lon");
latitude_NS = document.getElementById("lat_NS");
longitude_ES = document.getElementById("lon_ES");
// Vai testar se a latitude é Norte ou Sul e se a Longitude é Este ou Oeste...
// Consequentemente serão atribuídos valores negativos ou positivos
if(latitude_POS==="N"){
latitude_final = toDecimal(latitude);
}else if(latitude_POS==="S"){
latitude_final = toDecimal_Neg(latitude);
}
local_lat_final = document.getElementById("local_lat_final");
local_lat_final.innerHTML = `${latitude_final}`;
if(longitude_POS==="E"){
longitude_final = toDecimal(longitude);
}else if(longitude_POS==="W"){
longitude_final = toDecimal_Neg(longitude);
}
// "Mandar" a informação para os elementos através das variáveis
marca_tag.innerHTML = `${marca}`;
modelo_tag.innerHTML = `${modelo}`;
data_hora_tag.innerHTML = `${data_hora}`;
local_lat.innerHTML = `${latitude}`;
local_lon.innerHTML = `${longitude}`;
latitude_NS.innerHTML = `${latitude_POS}`;
longitude_ES.innerHTML = `${longitude_POS}`;
local_lon_final = document.getElementById("local_lon_final");
local_lon_final.innerHTML = `${longitude_final}`;
document.getElementById("mapa_google").src = "https://www.google.com/maps/embed/v1/place?key=AIzaSyDQSbRMCIv1gDsT2qRsY8HvLyZP11hte_Y&q="+latitude_final+"+"+longitude_final;
document.getElementById("link_area").value = "https://www.google.com/maps/place?key=AIzaSyDQSbRMCIv1gDsT2qRsY8HvLyZP11hte_Y&q="+latitude_final+"+"+longitude_final;
//Mostrar a secção com a info EXIF e redirecionar o ecrã para a mesma
var x = document.getElementById("exif_itens");
if (window.getComputedStyle(x).display === "none") {
x.style.display = "block";
x.scrollIntoView({ block: 'end', behavior: 'smooth' }); //Redireciona o ecrã para a área dos dados exif
}
});
}
答案 0 :(得分:1)
主要问题来自设置final_latitude
和final_longitude
的条件语句。如果latitude_POS
既不是N
也不是S
(如未定义!),将会发生什么。 longitude_POS
也是如此。
当图像中没有地理数据时会发生这种情况。
因此,对于每个条件,请使用最终的else
来捕获该条件并执行必要的步骤,以通知用户没有地理数据,同时设置一个标志,因此不会显示地图。