Точки построения Google Maps с использованием настраиваемых полей Wordpress

Я хочу заполнить карту Google точками сюжета, аналогичной tvsafety.org/map, но используя Wordpress и настраиваемые поля/типы сообщений. По сути, я создам пользовательский тип сообщения и укажу широту/долготу в качестве настраиваемого поля в сообщении.

Я очень хорошо знаком с Worpdress и интерфейсным разработчиком... но я предполагаю, что это будет связано с JSON или пользовательским XML, что немного выше моего понимания.

Может ли кто-нибудь предоставить некоторые шаги или указать в правильном направлении? В идеале я бы хотел, чтобы точка сюжета содержала (при ролловере) заголовок, изображение и постоянную ссылку, что я могу сделать... только не часть JSON/XML:/


person awvickers    schedule 18.07.2013    source источник


Ответы (1)


Я сделал это только на прошлой неделе:

Сначала Javascript:

   <style>
      html, body, #map-canvas {
        margin: 0;
        padding: 0;
        height: 100%;
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script>
var map;
function initialize() {
  var mapOptions = {
    zoom: 17,
   center: new google.maps.LatLng(-37.792363,144.982302),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
     /*Company Marker*/
    var companyPos = new google.maps.LatLng(-37.792363,144.982302);
    var companyMarker = new google.maps.Marker({
    position: companyPos,
    map: map,
    title:"Company Location"
    });

}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>

Затем в HTML:

<div class="googlemap" id="map-canvas"></div>

РЕДАКТИРОВАТЬ: первый lat, lng - это то место, где вы хотите центрировать карту. Вторая широта, долгота — это то место, где вы хотите, чтобы маркер появился.

person phil    schedule 18.07.2013
comment
Спасибо, но это не совсем то, что я собираюсь сделать, так как я хочу разместить пользовательские маркеры, т.е. ‹div› в качестве маркеров, поэтому я могу управлять содержимым (заголовок WP, избранное изображение, постоянная ссылка) внутри элемента ‹div›. - person awvickers; 18.07.2013
comment
ааа ок, не понял извини. В этом ответе есть то, что вам нужно: stackoverflow.com/questions/7616666/ - person phil; 19.07.2013