코스모스팜 스레드

exif 코드 수정 문의

안녕하세요. Pure Gallery 를 사용중이며, metadata 를 출력하기 위해 exif 의 출력 코드를 아래 링크를 참고해서 사용하고 있습니다.

https://www.cosmosfarm.com/threads/document/12511

그런데 metadata 가 한줄 씩 밑으로 내려가는데 모든 정보가 한줄에 출력되도록 하려면 어떻게 수정을 해야하는지 알고 싶습니다.

모델:NIKON Z 6
날짜:2020:11:15 13:53:58
ISO:200
초점거리:140
노출시간:1/8000

아래와 같이 정보가 한줄로 나오게 하고 싶습니다.

모델:NIKON Z 6 | 날짜:2020:11:15 13:53:58 | ISO:200 | 초점거리:140 | 노출시간:1/8000

그리고 어떤 사진에는 exif 가 잘 나오는데 또 어떤사진들을 나오지 않습니다. 그 기준이 무엇인지도 궁금합니다.

그럼 답변 기다리겠습니다.

미리 감사의 말씀 드리겠습니다.

web9355 (4 Point)ㆍ2021.02.14 03:27ㆍ조회 1544ㆍ RSS

추천 0 비추천

스레드봇 (31060 Point)ㆍ2021.02.15 11:10

안녕하세요~^^

올려주신 링크에서 document.php 파일에 추가한 자바스크립트 코드를 보면

이미지 정보를 ul 태그와 li 태그로 표시를 하고 있습니다.

한 줄에 표시되게 하시려면 ul 태그와 li 태그가 아닌

div 태그에 원하시는 표시 방법을 적용해주셔야 할 듯합니다.

일부 사진에만 exif가 표시되는 건 올려주신 내용만으로는 원인을 파악하기 어렵습니다.

실제 이미지 파일에 exif 데이터가 있는지 확인해보셔야 할 듯합니다.

고맙습니다.

추천 1 비추천

수정하기 삭제
web9355

답변 감사드립니다. 아래와 같이 수정해보았는데 여전히 한줄씩 따로 나오네요.

아래 코드에서 어디를 수정해야하는지 다시 한번 확인 부탁드리겠습니다.

미리 감사드립니다.

<script>
var my_kboard_exif_read_data_nonce = '<?php echo wp_create_nonce('my_kboard_exif_read_data_nonce')?>';
jQuery(document).ready(function(){
jQuery('.kboard-content img').each(function(){
var img = jQuery(this);
jQuery.post('<?php echo admin_url('admin-ajax.php');?>', {action:'my_kboard_exif_read_data', security:my_kboard_exif_read_data_nonce, src:img.attr('src')}, function(res){
if(!res.error){
var ul = jQuery('<div></div>');

if(res.ApertureFNumber) ul.append(jQuery('<div></div>').text('조리개:' + res.ApertureFNumber));
if(res.Model) ul.append(jQuery('<div></div>').text('모델:' + res.Model));
if(res.DateTimeOriginal) ul.append(jQuery('<div></div>').text('날짜:' + res.DateTimeOriginal));
if(res.ISOSpeedRatings) ul.append(jQuery('<div></div>').text('ISO:' + res.ISOSpeedRatings));
if(res.FocalLength) ul.append(jQuery('<div></div>').text('초점거리:' + eval(res.FocalLength)));
if(res.ExposureTime) ul.append(jQuery('<div></div>').text('노출시간:' + res.ExposureTime));

if(res.GPSLatitude && res.GPSLongitude){
var map_zoom = 11;
var map_size_width = 300;
var map_size_height = 200;

var deg = eval(res.GPSLatitude[0]);
var min = eval(res.GPSLatitude[1]);
var sec = eval(res.GPSLatitude[2]);
res.gps_lat = deg + ((min/60) + (sec/3600));

deg = eval(res.GPSLongitude[0]);
min = eval(res.GPSLongitude[1]);
sec = eval(res.GPSLongitude[2]);
res.gps_long = deg + ((min/60) + (sec/3600));

ul.append(jQuery('<div></div>').text('GPS:' + res.gps_lat + ',' + res.gps_long));
ul.append(jQuery('<div></div>').append(jQuery('<a href="https://www.google.com/maps/place/'+res.gps_lat+','+res.gps_long+'" onclick="window.open(this.href);return false;"><img src="https://maps.googleapis.com/maps/api/staticmap?zoom='+map_zoom+'&size='+map_size_width+'x'+map_size_height+'&maptype=roadmap
&markers=color:blue%7Clabel:S%7C'+res.gps_lat+','+res.gps_long+'&sensor=false" alt="" width="'+map_size_width+'" height="'+map_size_height+'" style="vertical-align:top;"></a>')));
}

img.after(ul);
}
}, 'json');
});
});
</script>

추천 0 비추천

삭제

스레드봇 (31060 Point)ㆍ2021.02.17 16:46

프로그램 코드를 올려야 할 경우 에디터의 코드 스니펫 삽입 기능을 사용해주세요.

div 태그는 기본적으로 block 속성이기 때문에 별도의 CSS 코드를 추가하지 않는다면

한 줄에 한 개씩 표시가 됩니다.

기존의 코드를 아래의 코드로 교체해서 확인해보시겠어요?

<script>
var my_kboard_exif_read_data_nonce = '<?php echo wp_create_nonce('my_kboard_exif_read_data_nonce')?>';
jQuery(document).ready(function(){
	jQuery('.kboard-content img').each(function(){
		var img = jQuery(this);
		jQuery.post('<?php echo admin_url('admin-ajax.php');?>', {action:'my_kboard_exif_read_data', security:my_kboard_exif_read_data_nonce, src:img.attr('src')}, function(res){
			if(!res.error){
				var ul = jQuery('<div></div>');
				var exif_data = [];
			
				if(res.ApertureFNumber) exif_data.push('조리개:' + res.ApertureFNumber);
				if(res.Model) exif_data.push('모델:' + res.Model);
				if(res.DateTimeOriginal) exif_data.push('날짜:' + res.DateTimeOriginal);
				if(res.ISOSpeedRatings) exif_data.push('ISO:' + res.ISOSpeedRatings);
				if(res.FocalLength) exif_data.push('초점거리:' + eval(res.FocalLength));
				if(res.ExposureTime) exif_data.push('노출시간:' + res.ExposureTime);
				
				if(res.GPSLatitude && res.GPSLongitude){
					var map_zoom = 11;
					var map_size_width = 300;
					var map_size_height = 200;
				
					var deg = eval(res.GPSLatitude[0]);
					var min = eval(res.GPSLatitude[1]);
					var sec = eval(res.GPSLatitude[2]);
					res.gps_lat = deg + ((min/60) + (sec/3600));
				
					deg = eval(res.GPSLongitude[0]);
					min = eval(res.GPSLongitude[1]);
					sec = eval(res.GPSLongitude[2]);
					res.gps_long = deg + ((min/60) + (sec/3600));

					exif_data.push('GPS:' + res.gps_lat + ',' + res.gps_long);
					exif_data.push('<a href="https://www.google.com/maps/place/'+res.gps_lat+','+res.gps_long+'" onclick="window.open(this.href);return false;"><img src="https://maps.googleapis.com/maps/api/staticmap?zoom='+map_zoom+'&amp;size='+map_size_width+'x'+map_size_height+'&amp;maptype=roadmap&#10;&amp;markers=color:blue%7Clabel:S%7C'+res.gps_lat+','+res.gps_long+'&amp;sensor=false" alt="" width="'+map_size_width+'" height="'+map_size_height+'" style="vertical-align:top;"></a>');
				}

				ul.append(exif_data.join(' | '));
				
				img.after(ul);
			}
		}, 'json');
	});
});
</script>

고맙습니다.

코스모스팜 스레드

exif 코드 수정 문의

스토어인기제품 더보기

커뮤니티새로운 글 더보기