Display posts on a map

时间:2017-06-26 作者:user3590313

wordpress移动应用程序允许您将gps位置存储为每个帖子的选项。我想有一个地图,显示每个职位的一个点。我看到了很多关于这方面的问题,大多数都很老了。我不知道从什么时候开始,移动应用程序允许你添加你的位置作为帖子的选项,但我想使用这个本地功能,而不是外部插件。有什么帮助吗?

1 个回复
最合适的回答,由SO网友:dbeja 整理而成

GPS位置保存在两个post meta字段上:geo_latitudegeo_longitude.

您可以使用这些元值在Google地图上绘制帖子作为标记。

例如,使用Google Maps API,您可以有如下模板:

<h1>Posts on map</h1>

<div id="map" style="height: 400px;"></div>
<script>

    // init map with the values you need
    function initMap() {
    var map = new google.maps.Map(document.getElementById(\'map\'), {
        zoom: 1,
        center: {lat: 0, lng: 0}
    });


    // get all posts that have meta_key geo_latitude
    <?php $query = new WP_Query( array( \'meta_key\' => \'geo_latitude\' ) ); ?>
    <?php while ( $query->have_posts() ) : $query->the_post(); ?>
        <?php 
            // get latitude and longitude from post meta
            $geo_latitude = get_post_meta( get_the_ID(), \'geo_latitude\', true );
            $geo_longitude = get_post_meta( get_the_ID(), \'geo_longitude\', true ); 
        ?>
        <?php if(!empty( $geo_latitude ) && !empty( $geo_longitude )): ?>
            var pos = {lat: <?php echo $geo_latitude; ?>, lng: <?php echo $geo_longitude; ?>};
            var marker = new google.maps.Marker({
              position: pos,
              map: map,
              title: \'<?php the_title(); ?>\'
            });
        <?php endif; ?>
    <?php endwhile; ?>
    <?php wp_reset_postdata(); ?>
  }
</script>

<script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY&callback=initMap">
</script>

结束

相关推荐

在WordPress中使用Google图形API

我试图在一个wordpress页面上实现一个图表。我正在使用谷歌指南中的这个页面-https://google-developers.appspot.com/chart/interactive/docs/basic_load_libs为了在wordpress中实现这一点,我尝试使用javascript wordpress guide-codex进行以下操作。wordpress。组织/使用JavascriptThe api says -要在WordPress中的帖子中使用JavaScript,您需要执行更多