拉特朗(中心,中心)周围的中心标记位置

时间:2015-10-05 15:52:12

标签: javascript html google-maps google-maps-api-3

我试图将谷歌地图标记放在Lat / Lang周围。而不是中心底部,我希望它成为中心。有什么想法吗?

非常感谢:)

function init_map() {
    var apt_latlang = new google.maps.LatLng(32.071197, 34.778754);
    var var_location = apt_latlang;
    var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
    var isDraggable = w > 480 ? true : false;

    var dorbel_map_styles = [ { "featureType": "water", "stylers": [ { "color": "#2A80B9" } ] },{ "elementType": "labels.text.fill", "stylers": [ { "color": "#382E2F" } ] },{ "elementType": "labels.text.stroke", "stylers": [ { "visibility": "off" } ] },{ "featureType": "road", "elementType": "labels.text.fill", "stylers": [ { "color": "#7F7F7F" } ] },{ "featureType": "landscape.man_made" } ]


    var var_mapoptions = {
        center: var_location,
        disableDefaultUI: true,
        navigationControl: false,
        scaleControl: false,
        scrollwheel: false,
        mapTypeControl: false,
        styles: dorbel_map_styles,
        zoom: 15,
        draggable: isDraggable,
        scrollwheel: false
    };
    var marker = new google.maps.Marker({
        position: apt_latlang,
        map: var_map,
        icon:'assets/images/dorbel_marker.svg'
    });

    var var_map = new google.maps.Map(document.getElementById("map"),
        var_mapoptions);




    marker.setMap(var_map);
}

1 个答案:

答案 0 :(得分:0)

您的代码包含javascript错误:Uncaught ReferenceError: myLatlng is not defined。当我解决它对我有用。

working fiddle

代码段



function init_map() {
  var apt_latlang = new google.maps.LatLng(32.071197, 34.778754);
  var var_location = apt_latlang;
  var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
  var isDraggable = w > 480 ? true : false;

  var dorbel_map_styles = [{
    "featureType": "water",
    "stylers": [{
      "color": "#2A80B9"
    }]
  }, {
    "elementType": "labels.text.fill",
    "stylers": [{
      "color": "#382E2F"
    }]
  }, {
    "elementType": "labels.text.stroke",
    "stylers": [{
      "visibility": "off"
    }]
  }, {
    "featureType": "road",
    "elementType": "labels.text.fill",
    "stylers": [{
      "color": "#7F7F7F"
    }]
  }, {
    "featureType": "landscape.man_made"
  }];


  var var_mapoptions = {
    center: var_location,
    disableDefaultUI: true,
    navigationControl: false,
    scaleControl: false,
    scrollwheel: false,
    mapTypeControl: false,
    styles: dorbel_map_styles,
    zoom: 15,
    draggable: isDraggable,
    scrollwheel: false
  };
  var marker = new google.maps.Marker({
    position: apt_latlang,
    map: var_map,
    icon: 'http://maps.google.com/mapfiles/ms/micons/blue.png'
  });
  // marker.setPosition(myLatlng);
  var var_map = new google.maps.Map(document.getElementById("map"),
    var_mapoptions);

  marker.setMap(var_map);
}
google.maps.event.addDomListener(window, 'load', init_map);

html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>
&#13;
&#13;
&#13;