縮放功能谷歌地圖

我在我的信息窗口中創建了一個按鈕，需要平移到標記，然後放大，但我無法讓它工作。下面是我的縮放功能縮放功能谷歌地圖

function Zoom(){ 
google.maps.event.addListener(marker, 'click', function() { 
    map.panTo(marker.position); 
    map.setZoom(18); 
});

這個函數創建標記並用下面的html填充信息窗口。

function createMarker(latlng, name, woonplaats, prijs, perceelop, woonop, address) { 
    var html ="<a href="+address+">"+"<b>"+name+"</b></a> <br/>" 
      + woonplaats +"</br>" + woonop + "/ " + perceelop + "</br>" + "€ " + prijs + 
      "</br><input id='zoombutton' type='button' onclick='Zoom()' value='Zoom in' />" 
    var marker = new google.maps.Marker({ 
    map: map, 
    position: latlng 
    }); 
    google.maps.event.addListener(marker, 'click', function() { 
    infoWindow.setContent(html); 
    infoWindow.open(map, marker); 
    }); 
    markers.push(marker); 
}

如果我刪除的啞劇功能它放大，但因此它在一個完全不同的地方會放大它不泛的標記。如果縮放級別爲18或更高，但沒有結果，我也試圖使按鈕不可見。

任何幫助將不勝感激！

來源

2015-09-22 Rowin ten Hoope

請提供[最小，完整，測試和可讀示例]（http://stackoverflow.com/help/mcve ）證明了這個問題。 – geocodezip

marker.position是一個未記錄的參數（如果存在）。使用marker.getPosition()來獲取標記的位置。

function Zoom(){ 
    google.maps.event.addListener(marker, 'click', function() { 
    map.panTo(marker.getPosition()); 
    map.setZoom(18); 
    }); 
// ?? 
}

我得到一個JavaScript錯誤與您的代碼，但：Uncaught ReferenceError: marker is not defined

不知道爲什麼你在按鈕的onclick功能
，你將需要保持引用添加click偵聽所有的標記（假設有多個標記）

// in the global scope: 
var markers = []; 

function Zoom(markerNum) { 
    // markerNum is the index of this marker in the markers array 
    map.panTo(markers[markerNum].getPosition()); 
    map.setZoom(18); 
}

working fiddle

代碼片斷：

var map; 
 
var markers = []; 
 
var infoWindow = new google.maps.InfoWindow(); 
 

 
function initialize() { 
 
    map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     center: new google.maps.LatLng(37.4419, -122.1419), 
 
     zoom: 13, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    createMarker(map.getCenter(), "Palo Alto"); 
 
    createMarker({ 
 
    lat: 37.42410599999999, 
 
    lng: -122.1660756 
 
    }, "Stanford"); 
 
} 
 

 
function createMarker(latlng, name) { 
 
    var html = name + "</br><input id='zoombutton' type='button' onclick='Zoom(" + markers.length + ")' value='Zoom in' />" 
 
    var marker = new google.maps.Marker({ 
 
    map: map, 
 
    position: latlng 
 
    }); 
 
    google.maps.event.addListener(marker, 'click', function() { 
 
    infoWindow.setContent(html); 
 
    infoWindow.open(map, marker); 
 
    }); 
 
    markers.push(marker); 
 
} 
 

 
function Zoom(markerNum) { 
 
    map.panTo(markers[markerNum].getPosition()); 
 
    map.setZoom(18); 
 
} 
 
google.maps.event.addDomListener(window, "load", initialize);

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

<script src="https://maps.googleapis.com/maps/api/js?"></script> 
 
<div id="map_canvas"></div>

來源

2015-09-22 16:27:30 geocodezip

縮放功能谷歌地圖

回答

相關問題