Google地图上未显示位置图标

时间:2016-02-15 08:11:25

标签: javascript jquery html5 google-maps user-interface

window.onload = function initmap() {
  var styles = [{
    "featureType": "water",
    "stylers": [{
      "color": "#2b2b2b"
    }]
  }, {
    "featureType": "landscape",
    "stylers": [{
      "visibility": "on"
    }, {
      "color": "#333333"
    }]
  }, {
    "featureType": "road.highway",
    "stylers": [{
      "visibility": "on"
    }, {
      "color": "#808080"
    }]
  }, {
    "featureType": "road.highway",
    "elementType": "labels.text.stroke",
    "stylers": [{
      "visibility": "off"
    }, {
      "color": "#808080"
    }]
  }, {
    "elementType": "labels.icon",
    "stylers": [{
      "color": "#5d5d5d"
    }, {
      "visibility": "off"
    }]
  }, {
    "elementType": "geometry.fill",
    "stylers": [{
      "color": "#5d5d5d"
    }, {
      "visibility": "off"
    }]
  }, {
    "featureType": "water",
    "elementType": "geometry.fill",
    "stylers": [{
      "color": "#808080"
    }, {
      "visibility": "on"
    }]
  }, {
    "featureType": "water",
    "elementType": "labels.text.fill",
    "stylers": [{
      "visibility": "off"
    }]
  }];
  var options = { // googel map with javascript
    mapTypeControlOptions: {
      mapTypeIds: ['Styled']
    },
    center: new google.maps.LatLng(41.786254, -85.428930),
    zoom: 16,
    disableDefaultUI: true,
    mapTypeId: 'Styled'
  };
  var div = document.getElementById('surabaya');
  var map = new google.maps.Map(div, options);
  var styledMapType = new google.maps.StyledMapType(styles, {
    name: 'Styled'
  });
  map.mapTypes.set('Styled', styledMapType);


  var map1 = new google.maps.Map(document.getElementById('map1'), {
    zoom: 4,
    center: {
      lat: 41,
      lng: -85
    }
  });
  var image = 'images/marker.png';
  var beachMarker = new google.maps.Marker({
    position: {
      lat: 41.786254,
      lng: -85.428930
    },
    map: map1,
    icon: image
  });
};
#surabaya {
  width: 100%;
  height: 400px;
}
<div id="surabaya"></div>

我想在谷歌地图中编辑我已成功更改样式。现在我想显示我选择的位置标记。我无法设置我选择的图标,我也没有得到谷歌地图的默认图标标记。我已经附加了我的所有代码,我还附加了谷歌地图api脚本,并已输入我自己的API-KEY剧本。

1 个答案:

答案 0 :(得分:1)

试试这..它应该可以帮到你确定.. 将 base_url()路径用于markerimage。

var image = new google.maps.MarkerImage("images/marker.png");
var beachMarker = new google.maps.Marker({
 position: {
   lat: 41.786254,
   lng: -85.428930
 },
 map: map1,
 icon: image
});