繁体   English   中英

样式的地图和地方资料库Google Map API v3

[英]styled maps and places library Google Map API v3

我如何从Google地方信息库中获取结果,以显示在样式化的Google地图上? 有了这段代码,我只得到样式化的地图,没有地方。

<script type="text/javascript"
  src="http://maps.googleapis.com/maps/api/js?key=mykey&sensor=true">
</script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=true"></script>  


<script type="text/javascript">


 function initialize() {
var styles = [ { featureType: "road.arterial", elementType: "geometry", stylers: [ {   color: "#808080" }, { weight: 0.5 } ] },{ featureType: "road.arterial", elementType: "labels.text.stroke", stylers: [ { visibility: "on" }, { color: "#fafafa" } ] },{ featureType: "water", elementType: "geometry", stylers: [ { color: "#b4d2fa" } ] },{ featureType: "water", elementType: "geometry.fill", stylers: [ { color: "#9c3239" } ] } ]

var styledMap = new google.maps.StyledMapType(styles,
{name: "WATS Map"});

var myLatLng = new google.maps.LatLng(42.3068, -83.681)

var mapOptions = {
zoom: 12,
center: myLatLng,
mapTypeControlOptions: {
  mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
}
};
var map = new google.maps.Map(document.getElementById('map_canvas'),
mapOptions);


map.mapTypes.set('map_style', styledMap);
map.setMapTypeId('map_style');


var request = {
      location: myLatLng,
      radius: 1500,
      types: ['store']
    };
    var infowindow = new google.maps.InfoWindow();
    var service = new google.maps.places.PlacesService(map);
    service.search(request, callback);
  }

  function callback(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
      for (var i = 0; i < results.length; i++) {
        createMarker(results[i]);
      }
    }
  }

  function createMarker(place) {
    var placeLoc = place.geometry.location;
    var marker = new google.maps.Marker({
      map: styledMap,
      position: place.geometry.location
    });

    google.maps.event.addListener(marker, 'click', function() {
      infowindow.setContent(place.name);
      infowindow.open(styledMap, this);
    });
  }
</script>

您必须将变量map全局,并将map分配给createMarker()标记的map-option

当前,您在styledMap使用styledMap ,但这不是地图对象,而是StyledMapType

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM