-1
WordPress functions.php 내에 여러 개의 Google지도를 추가하려고하지만 마지막지도 만 표시됩니다.단축 코드로 여러 개의 Google지도
여러 맵을 표시하려면 어떻게해야합니까? 단축 코드 루프를 만들 수 있습니까?
var "map"을 $ arg 또는 임의의 ID로 바꾸려고 시도했지만 성공하지 못했습니다.
add_shortcode('map', 'gmaps_map');
function gmaps_map($args) {
$id = substr(sha1("Google Map" . time()), rand(2, 10), rand(5, 8));
ob_start();
$args = shortcode_atts(array(
'lat' => '49',
'lng' => '9',
'zoom' => '12',
'height' => '300px',
'id' => '0'
), $args, 'map');
?>
<div class='map' style='height:<?php echo $args['height'] ?>;' id='map-<?php echo $id ?>'></div>
<script type='text/javascript'>
var <?php echo $args['id'] ?>;
function initMap() {
map = new google.maps.Map(document.getElementById('map-<?php echo $id ?>'), {
center: {lat: <?php echo $args['lat'] ?>, lng: <?php echo $args['lng'] ?>},
zoom: <?php echo $args['zoom'] ?>
});
var image = new google.maps.MarkerImage("<?php echo get_template_directory_uri(); ?>/images/marker.png", null, null, null, new google.maps.Size(64,64));
var marker = new google.maps.Marker({
position: {lat: <?php echo $args['lat'] ?>, lng: <?php echo $args['lng'] ?>},
map: map,
icon: image, // null = default icon
animation: google.maps.Animation.DROP,
title: 'Hello World!'
});
}
</script>
<?php
$output = ob_get_clean();
return $output;
}
add_action('wp_enqueue_scripts', 'gmaps_enqueue_assets');
function gmaps_enqueue_assets() {
wp_enqueue_script(
'google-maps',
'//maps.googleapis.com/maps/api/js?callback=initMap',
array(),
'1.0',
true
);
}
무엇을 디버깅하려고 않았다 (안 functions.php 단축 코드 내에서) 별도의 js 파일 내에서 작동? JS 콘솔에 오류가 있습니까? 'id = 'map - php echo $ id?>''출력 HTML을 검사한다면 무엇을 출력합니까? 아무도 작은 정보로는 당신을 도울 수 없거나 도와 줄 수 없습니다. – MrUpsidown
감사합니다. id가 제대로 표시됩니다. 문제는 initMap에서 발생했습니다 (아래 참조). – stackster