Question

场合

我正在网站上使用Google Maps Javascript API（实验版，3.exp）来使用Google地图网址绘制Google地图。地图显示以特定位置为中心的标记。用户可以选择将网址更改为另一个谷歌地图网址，这将为该位置绘制不同的地图。

我目前正在使用地理编码服务，但这与在Google地图上搜索地点不同，这就是我所需要的。

如果返回零结果，我将获得默认位置
如果返回部分匹配，则该位置与Google地图中的搜索结果不同

那么，有没有办法从谷歌地图网址中提取标记的位置（latlng坐标）（在谷歌地图上搜索一个地方后）？或者有没有办法使用url以某种方式（通过API）请求此数据？

我目前正在使用普通网址（不是分享或嵌入网址），但任何网址都可以。

代码

var url = 'https://www.google.co.kr/maps/place/%EC%84%9C%EC%9A%B8%EB%AC%B5%ED%98%84%EC%B4%88%EB%93%B1%ED%95%99%EA%B5%90/@37.6089244,127.0714647,17z/data=!3m1!4b1!4m2!3m1!1s0x357cbbb0c068042b:0xd9af658c047868cc';
maps = url.split("/");

if(typeof maps[5] == "undefined" || typeof maps[6] == "undefined") {
    console.log('incorrect google map URL');
    return false;
}

var pos = maps[6].replace("@", "").split(","),
  zoom = Number(pos[2].replace("z", "")),
  Latlng = new google.maps.LatLng(pos[0], pos[1]),
  map = new google.maps.Map(document.getElementById(element), {
    center: Latlng,
    zoom: zoom,
    scrollwheel: true,
    navigationControl: true,
    mapTypeControl: false,
    scaleControl: false,
  });

var marker = new google.maps.Marker({
  position: Latlng,
  map: map,
});

<div id="element">Google Map should be here</div>

<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?v=3.exp"></script>

Answer 1

此解决方案部分正确。如果您在Google地图中搜索某个地点，然后使用生成的网址而不平移地图，您的地图将偏移正确的数量（使用我的方法绘制地图和标记以更正地点标记的调整后的lat / lng值谷歌地图）。否则，这个解决方案在我的情况下不起作用，因为我在google地图网址中使用lat / lng坐标（它基于视口的中心而不是地点的标记lat / lng值）。

      // make a new Latlng object (var Latlng = new google.maps.LatLng...)
      // make a new map (var map = new google.maps.Map...)
      // add a new marker (var marker = new google.maps.Marker...)

      // set the tile size to 256 pixels
     var TILE_SIZE = 256;

      // use a setTimeout to move the marker to the correct position after 
      // initializing your map (I tried with different values, and 300 seems 
      // to be the lowest value.
     setTimeout(function() {
       // get the new center for your map (because using a url from google 
       // maps will display your marker and map center left (west) of the
       // actual place.
       var newLatlng = getNewCenter(map, marker.getPosition(), map.getZoom());

       // set the new map center and marker
       map.setCenter(newLatlng);
       marker.setPosition(newLatlng);
     }, 300);

      // This function is from another post. It gets world coordinates for a 
      // Latlng object.
     function project(latLng) {
       var siny = Math.sin(latLng.lat() * Math.PI / 180);

       // Truncating to 0.9999 effectively limits latitude to 89.189. This is
       // about a third of a tile past the edge of the world tile.
       siny = Math.min(Math.max(siny, -0.9999), 0.9999);

       return new google.maps.Point(
         TILE_SIZE * (0.5 + latLng.lng() / 360),
         TILE_SIZE * (0.5 - Math.log((1 + siny) / (1 - siny)) / (4 * Math.PI)));
     }

      // This function was adapted from code for pixelOffsetForWorldCoordinate
      // or something like that. It will offset the old (incorrect map center)
      // by 0.8 tiles, which is exactly the right amount to match the map 
      // center and marker location in google maps
     function getNewCenter(map, latLng, zoom) {
       var scale = 1 << zoom;

       var worldCoordinate = project(latLng);

       var tileCoordinate = new google.maps.Point(
         worldCoordinate.x * scale / TILE_SIZE,
         worldCoordinate.y * scale / TILE_SIZE
       );

       tileCoordinate.x += 0.8;

       var newWorldCoordinate = {
           x: '',
           y: ''
         },
         tcX = tileCoordinate.x,
         tcY = tileCoordinate.y;

       newWorldCoordinate.x = tcX * TILE_SIZE / scale;
       newWorldCoordinate.y = tcY * TILE_SIZE / scale;

       // convert the new world coordinate to a Latlng object
       var newLatlng = map.getProjection().fromPointToLatLng(newWorldCoordinate);

       return newLatlng;
     }

我可以获取搜索地点的标记坐标，如谷歌地图所示吗？

代码

1 个答案: