GoogleマップのピンをPHPとJavascriptで配置する

Question

PHPとJavascriptでマーカーを印刷しようとしています。以下のコードは動作します。私は基本的にそれぞれ新しいマーカーを印刷しています。しかし、私はこれが非常に効率的または最適な方法ではないと感じています。

別のスタックスレッドで言及したことは、PHP配列を作成し、それをjs_encode経由でjavascript配列に変換する方が良いということです。それを使ってマーカーを出力します。これを行う方法に関するいくつかの指針は、私がやろうとしていることを行うための素晴らしい方法、またはより効率的な方法でしょうか？ありがとう。

<?php 

global $post; 
$args = array('post_type' => 'my_places'); 

$myposts = get_posts($args); 

foreach ($myposts as $post) : setup_postdata($post); 
      $pin_location = get_field('my_map'); 
      $pin_latitude = $pin_location['lat']; 
      $pin_longitude = $pin_location['lng']; 
      $pin_title = get_the_title(); 
      $pin_content = get_the_content(); 
?> 
     var marker = new google.maps.Marker({ 
      position: {lat: <?php echo $pin_latitude; ?>, lng: <?php echo $pin_longitude; ?>}, 
      map: map, 
      title: 'Pin Title' 
     }); 

<?php endforeach; 
wp_reset_postdata();?> 

Answer 1

は、それがhere

global $post; 
$args = array('post_type' => 'my_places'); 

$myposts = get_posts($args); 

foreach ($myposts as $post) : setup_postdata($post); 
      $pin_location = get_field('my_map'); 
      $pin_latitude = $pin_location['lat']; 
      $pin_longitude = $pin_location['lng']; 
      $pin_title = get_the_title(); 
      $pin_content = get_the_content(); 
      $pin_icon = 'https://www.prudential.com.sg/export/system/modules/com.prudential.template/resources/images/MainNavigation/Map_small_icon.png'; 

?> 
     var marker = new google.maps.Marker({ 
      position: {lat: <?php echo $pin_latitude; ?>, lng: <?php echo $pin_longitude; ?>}, 
      map: map, 
      title: 'Pin Title', 
      icon: <?php echo $pin_icon;?> 
     }); 

<?php endforeach; 
wp_reset_postdata();?> 

をあなたに役立つHTMLのデモだかもしれ