本文介绍了如何在Google地图中添加标记的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

以下代码工作正常,但无法在此添加标记...



我尝试过:



< pre><!DOCTYPE html> 
< html>
< head>
< style type =text / css>
html,body,#map_canvas {margin:0;填充:0;身高:100%}
< / style>
< script type =text / javascriptsrc =http://maps.googleapis.com/maps/api/js?sensor=false>< / script>
< script type =text / javascript>
var map;
var grayStyles =

[
{
elementType:geometry,
stylers:[
{
颜色:#f5f5f5
}
]
},
{
elementType:labels.icon,
风格:[
{
能见度:关闭
}
]
},
{
elementType:标签.text.fill,
the stylers:[
{
color:#616161
}
]
},
{
elementType:labels.text.stroke,
stylers:[
{
color:#f5f5f5
}
]
},
{
featureType:administrative.land_parcel,
elementType:labels.text.fill,
风格:[
{
color:#c0c0c0
},
{
visibility:off
}
]
},
{
featureType:poi,
elementType:geometry,
风格:[
{
color:#eeeeee
}
]
},
{
featureType :poi,

stylers:[
{visibility:off}
]
},
{
featureType:poi.park,
elementType:geometry,
stylers:[
{
color:#e5e5e5
}
]
},
{
featureType:poi.park,
elementType:geometry.fill,
stylers:[
{
visibility:off
}
]
},
{
featureType :poi.park,
elementType:geometry.stroke,
stylers:[
{
visibility:off
}
]
},
{
featureType:poi.park,
elementType:labels.icon,
风格:[
{
能见度:关闭
}
]
},
{
featureType :poi.park,
the stylers:[
{visibility:off}
]
},
{
featureType:poi.park,
elementType:labels.text.stroke,
stylers:[
{
color:#9e9e9e
},
{
能见度:关闭
}
]
},
{
featureType :road,
elementType:geometry,
stylers:[
{
color:#fffffff
}
]
},
{
featureType:road.arterial,
elementType:labels.text.fill,
风格:[
{
颜色:#757575
}
]
},
{
featureType: road.highway,
elementType:几何,
风格:[
{
color:#dadada
}
]
},
{
featureType:road.highway,
elementType:labels.icon,
风格:[
{
能见度:关闭
}
]
},
{
featureType: road.highway,
elementType:labels.text.fill,
stylers:[
{
color:#616161
},
{
能见度:关闭
}
]
},
{
featureType: road.highway,
elementType:labels.text.stroke,
stylers:[
{
visibility:off
}
]
},
{
featureType:road.local,
elementType:labels.text.fill,
风格:[
{
color:#9e9e9e
}
]
},
{
featureType :transit.line,
elementType:geometry,
stylers:[
{
color:#e5e5e5
}
]
},
{
featureType:transit.station,
elementType:g eometry,
stylers:[
{
color:#eeeeee
}
]
},
{
featureType:water,
elementType:geometry,
stylers:[
{
color:#c9c9c9
}
]
},
{
featureType:water,
elementType:labels.text.fill,
风格:[
{
color:#9e9e9e
}
]
}
];
var mapOptions = {
center:new google.maps.LatLng(41.327670,19.8029607),
zoom:15,
styles:grayStyles,
mapTypeControl:false,
disableDefaultUI:true,

mapTypeId:google.maps.MapTypeId.ROADMAP
};

函数initialize(){
map = new google.maps.Map(document.getElementById(map_canvas),mapOptions);

}

google.maps.event.addDomListener(window,'load',initialize);
< / script>
< / head>
< body>
< div id =map_canvas>< / div>
< / body>
< / html>
解决方案

Below code is working fine but unable to add marker on this ...

What I have tried:

<pre><!DOCTYPE html>
<html>
  <head>
    <style type="text/css">
      html, body, #map_canvas { margin: 0; padding: 0; height: 100% }
    </style>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
      var map;
      var grayStyles =

[
  {
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#f5f5f5"
      }
    ]
  },
  {
    "elementType": "labels.icon",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#616161"
      }
    ]
  },
  {
    "elementType": "labels.text.stroke",
    "stylers": [
      {
        "color": "#f5f5f5"
      }
    ]
  },
  {
    "featureType": "administrative.land_parcel",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#c0c0c0"
      },
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "poi",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#eeeeee"
      }
    ]
  },
  {
    "featureType": "poi",

    "stylers": [
      { "visibility": "off" }
    ]
  },
  {
    "featureType": "poi.park",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#e5e5e5"
      }
    ]
  },
  {
    "featureType": "poi.park",
    "elementType": "geometry.fill",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "poi.park",
    "elementType": "geometry.stroke",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "poi.park",
    "elementType": "labels.icon",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "poi.park",
    "stylers": [
      { "visibility": "off" }
    ]
  },
  {
    "featureType": "poi.park",
    "elementType": "labels.text.stroke",
    "stylers": [
      {
        "color": "#9e9e9e"
      },
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "road",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#ffffff"
      }
    ]
  },
  {
    "featureType": "road.arterial",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#757575"
      }
    ]
  },
  {
    "featureType": "road.highway",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#dadada"
      }
    ]
  },
  {
    "featureType": "road.highway",
    "elementType": "labels.icon",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "road.highway",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#616161"
      },
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "road.highway",
    "elementType": "labels.text.stroke",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "road.local",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#9e9e9e"
      }
    ]
  },
  {
    "featureType": "transit.line",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#e5e5e5"
      }
    ]
  },
  {
    "featureType": "transit.station",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#eeeeee"
      }
    ]
  },
  {
    "featureType": "water",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#c9c9c9"
      }
    ]
  },
  {
    "featureType": "water",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#9e9e9e"
      }
    ]
  }
];
      var mapOptions = {
        center: new google.maps.LatLng(41.327670, 19.8029607),
        zoom: 15,
        styles: grayStyles,
        mapTypeControl: false,
      disableDefaultUI: true,

        mapTypeId: google.maps.MapTypeId.ROADMAP
      };

      function initialize() {
        map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

      }

      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map_canvas"></div>
  </body>
</html>
解决方案


这篇关于如何在Google地图中添加标记的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-02 23:05