Google지도 API v3 - 여러 다각형의 사용자 정의 InfoBox
-
10-12-2019 - |
문제
Google지도 API로 처음 작업하는 것은 처음입니다.나는 각각 자신의 InfoBox를 필요로하는 다수의 다각형이있는 스타일의지도를 가지고있다.InfoBoxes는 스타일을 받아야합니다.내 문제는 내가 infoboxes를 전혀 일할 수 없다는 것입니다.나는 지금 당시 솔루션을 찾고 있었고, 나는이 http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/examples/infobox-basic.html. 분명히 뭔가 잘못되어야합니다.
여기에 내 코드가 있습니다 : http://pastebin.com/m23ppxpn
해결책
infobox.js 에서이 오류가 발생하면 infobox를 다각형에 연결하면이 오류가 발생합니다
Uncaught TypeError: Object #<V> has no method 'getPosition'
.
다각형이 영역을 나타내는 반면 마커가 점을 나타내는 것일 수 있습니다.나는 각각의 InfoBox를 고정하기 위해 다각형 내부의 어딘가에있는 단일 보이지 않는 마커를 만드는 것을 제안한다.
이 아이디어를 사용하면 호주 다각형에 InfoBox를 추가했습니다.클릭 수신기는 여전히 다각형을 위해 만들어 지지만 InfoBox가 보이지 않는 마커에 묶여 있습니다.
// ... this is near the end of your code...
australia_new_zealand.setMap(map);
google.maps.event.addListener(australia_new_zealand, 'mouseover', function() {
this.setOptions({fillColor: "#28d1e9"});
});
google.maps.event.addListener(australia_new_zealand, 'mouseout',function(){
this.setOptions({fillColor: "#06376a"});
});
// marker inside the Australia polygon, LatLng was manually defined
var australia_new_zealand_center = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(-24.5271348225978, 134.296875),
visible: false
});
var boxText = document.createElement("div");
boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: yellow; padding: 5px;";
boxText.innerHTML = "City Hall, Sechelt<br>British Columbia<br>Canada";
var myOptions = {
content: boxText,
maxWidth: 0,
pixelOffset: new google.maps.Size(-140, 0),
zIndex: null,
boxStyle: { background: "url('tipbox.gif') no-repeat", opacity: 0.75, width: "280px" } ,
closeBoxMargin: "10px 2px 2px 2px",
closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
infoBoxClearance: new google.maps.Size(1, 1),
isHidden: false,
pane: "floatPane",
enableEventPropagation: false
}
// listener responds to a click inside polygon
google.maps.event.addListener(australia_new_zealand, "click", function (e) {
ib.open(map, australia_new_zealand_center);
});
var ib = new InfoBox(myOptions);
//(end) REGION - AUSTRALIA NEW ZEALAND
}
. 다른 팁
예제 로이 놀이터를 사용해보십시오 놀이터
제휴하지 않습니다 StackOverflow