-1
我在使用Google地圖API(javascript)的標記選項的狀態下找到了32個位置(區域)。另外我想通過點擊標記來放大位置(區域)。但當我點擊標記它是不縮放確切的位置(區)我標記。請幫助我解決方案。縮放選項在單擊標記時未找到標記的位置
我已經發布我下面的代碼:
<!DOCTYPE html>
<html>
<head>
<title>marker</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
\t </head>
\t \t <body>
\t \t \t <div id="map" style="width: 1366px; height: 700px;"></div>
\t \t \t <script>
\t
\t \t \t \t \t var minZoomLevel = 7;
\t \t \t \t \t
\t \t \t \t function initMap() {
\t \t \t \t \t \t var myLatlng = {
\t \t \t \t \t \t \t lat: 11.127123,
\t \t \t \t \t \t \t lng: 78.656894
\t \t \t \t \t \t };
\t \t \t \t \t \t var map = new google.maps.Map(document.getElementById('map'), {
\t \t \t \t \t \t \t zoom: minZoomLevel,
\t \t \t \t \t \t \t center: myLatlng,
\t \t \t \t \t \t \t mapTypeId: google.maps.MapTypeId.HYBRID
\t \t \t \t \t \t });
\t \t \t \t \t \t var emptyStyles = [{
\t \t \t \t \t \t \t featureType: "all",
\t \t \t \t \t \t \t elementType: "labels",
\t \t \t \t \t \t \t stylers: [{
\t \t \t \t \t \t \t \t visibility: "off"
\t \t \t \t \t \t \t }]
\t \t \t \t \t \t }];
\t \t \t \t \t \t map.setOptions({
\t \t \t \t \t \t \t styles: emptyStyles
\t \t \t \t \t \t });
\t \t \t \t \t \t google.maps.event.addListener(map, 'zoom_changed', function() {
\t \t \t \t \t \t \t if (map.getZoom() < minZoomLevel) map.setZoom(minZoomLevel);
\t \t \t \t \t \t });
\t \t \t \t \t \t var districts = new Array("Namakkal", "Madurai", "Perambalur", "The Nilgiris", "Ariyalur", "Karur", "Theni", "Chennai", "Kancheepuram", "Vellore", "Thiruvallur", "Villupuram", "Coimbatore", "Tirunelveli", "Tiruchirappalli", "Cuddalore", "Tiruppur", "Tiruvannamalai", "Thanjavur", "Erode", "Dindigul", "Virudhunagar", "Krishnagiri", "Kanniyakumari", "Thoothukkudi", "Pudukkottai", "Nagapattinam", "Dharmapuri", "Ramanathapuram", "Sivagangai", "Thiruvarur");
\t \t \t \t \t \t var geocoder = new google.maps.Geocoder();
\t \t \t \t \t \t var marker;
\t \t \t \t \t \t for (index = 0; index < districts.length; ++index) {
\t \t \t \t \t \t \t //alert(districts[index]);
\t \t \t \t \t \t \t geocoder.geocode({
\t \t \t \t \t \t \t \t 'address': districts[index]
\t \t \t \t \t \t \t }, function(results, status) {
\t \t \t \t \t \t \t \t //alert(districts[index]);
\t \t \t \t \t \t \t \t if (status == google.maps.GeocoderStatus.OK) {
\t \t \t \t \t \t \t \t \t //alert(index);
\t \t \t \t \t \t \t \t \t var latitude = results[0].geometry.location.lat();
\t \t \t \t \t \t \t \t \t var longitude = results[0].geometry.location.lng();
\t \t \t \t \t \t \t \t \t //alert(latitude);
\t \t \t \t \t \t \t \t \t //alert(longitude);
\t \t \t \t \t \t \t \t }
\t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t marker = new google.maps.Marker({
\t \t \t \t \t \t \t \t \t position: {
\t \t \t \t \t \t \t \t \t \t lat: latitude,
\t \t \t \t \t \t \t \t \t \t lng: longitude
\t \t \t \t \t \t \t \t \t },
\t \t \t \t \t \t \t \t \t map: map,
\t \t \t \t \t \t \t \t \t animation: google.maps.Animation.DROP,
\t \t \t \t \t \t \t \t \t //labelContent: "chennai",
\t \t \t \t \t \t \t \t // labelStyle: {opacity: 0.75},
\t \t \t \t \t \t \t \t \t title: districts[index]
\t \t \t \t \t \t \t \t });
\t \t \t \t \t \t \t \t map.addListener('center_changed', function() {
\t \t \t \t \t \t \t \t \t window.setTimeout(function() {
\t \t \t \t \t \t \t \t \t \t map.panTo(marker.getPosition());
\t \t \t \t \t \t \t \t \t }, 100);
\t \t \t \t \t \t \t \t });
\t \t \t \t \t \t \t \t marker.addListener('click', function() {
\t \t \t \t \t \t \t \t \t map.setZoom(8);
\t \t \t \t \t \t \t \t \t map.setCenter(marker.getPosition());
\t \t \t \t \t \t \t \t \t map.getBounds();
\t \t \t \t \t \t \t \t });
\t \t \t \t \t \t \t });
\t \t \t \t \t \t }
\t \t \t \t \t }
\t \t \t \t \t \t function sleep(milliseconds) {
\t \t \t \t \t \t var start = new Date().getTime();
\t \t \t \t \t \t for (var i = 0; i < 1e7; i++) {
\t \t \t \t \t \t \t if ((new Date().getTime() - start) > milliseconds) {
\t \t \t \t \t \t \t \t break;
\t \t \t \t \t \t \t }
\t \t \t \t \t \t }
\t \t \t \t \t }
\t \t \t </script>
\t \t \t \t <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBIVqRDN8E_OEPcarzmz5mIJbyk25x424c&signed_in=true&callback=initMap" async defer>
\t \t \t \t </script>
\t </body>
</html>
我得到一個javascript錯誤與發佈的代碼:'InvalidValueError:setPosition:不是一個LatLng或LatLngLiteral:屬性lat:不是一個數字' – geocodezip
這是什麼代碼? 'map.addListener('center_changed',function(){window.setTimeout(function(){map.panTo(marker.getPosition());},100);});' – geocodezip