Uncaught TypeError：Object＃< Element>没有方法'getPosition' [英] Uncaught TypeError: Object #<Element> has no method 'getPosition'
本文介绍了Uncaught TypeError：Object＃< Element>没有方法'getPosition'的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我试图在地图中显示可见的标记，并且无法使此代码正常工作。在控制台中，它显示标记信息，就像我期望的那样。
< marker name =Jolly rogers，address =1850 Scales Bend Rdlat =41.7609lng = -91.6574distance =217.212>< / marker>
但是我收到错误：
未捕获的类型错误：对象＃没有方法'getPosition'
我有什么错？
function showVisibleMarkers（）{
for（var i = 0; i< markers.length; i ++）{
console.log（markers [i ]）;
if（map.getBounds（）。contains（markers [i] .getPosition（）））{
//显示标记的代码
}
}
}
以下是创建地图的代码。
函数displaymap（lat，lng，state，min，max）{
map = new google.maps.Map（document.getElementById（mapdiv）） ，{
center：new google.maps.LatLng（lat，lng），
zoom：7，
mapTypeId：'roadmap'，
panControl：true，
zoomControl：true，
streetViewControl：true，
mapTypeControl：true
}）;
var infoWindow = new google.maps.InfoWindow;
//根据您的PHP文件的名称更改此值
downloadUrl（/ inc / db_query.php？lat =+ lat +& lng =+ lng +& state = + state +& min =+ min +& max =+ max，function（data）{
var xml = data.responseXML;
var bounds = new google.maps。 LatLngBounds（）;
markers = xml.documentElement.getElementsByTagName（marker）;
for（var i = 0; i< markers.length; i ++）{
var name = markers [i] .getAttribute（name）;
var address = markers [i] .getAttribute（address）;
if（markers [i] .getAttribute（daily）=== ''）{
var icon ='/img/blackdot.png';
} else if（markers [i] .getAttribute（daily）=== 0）{
var （标记[i] .getAttribute（daily）> 0&&&&&标记[i] .getAttribute（每天）< 10）{
var icon ='/img/bluedot.png';
} else if（markers [i] .ge tAttribute（每日）> 9&&标记[i] .getAttribute（每日）< 20）{
var icon ='/img/purpledot.png';
} else if（markers [i] .getAttribute（daily）> 19&& amp; markers [i] .getAttribute（daily）< 30）{
var icon =' /img/reddot.png';
} else if（markers [i] .getAttribute（daily）> 29&&& marker [i] .getAttribute（daily）< 40）{
var icon =' /img/orangedot.png';
} else if（markers [i] .getAttribute（daily）> 39&&&& ;; markers [i] .getAttribute（daily）< 50）{
var icon =' /img/yellowdot.png';
} else if（markers [i] .getAttribute（daily）> 49）{
var icon ='/img/whitedot.png';
var position = new google.maps.LatLng（
parseFloat（markers [i] .getAttribute（lat）），
parseFloat（markers [i] .getAttribute （ LNG）））;
var html =< b> + name +< / b>< br /> +地址;
var marker = new google.maps.Marker（{
map：map，
position：position，
icon：icon
}）;
bindInfoWindow（marker，map，infoWindow，html）;
bounds.extend（position）;
map.fitBounds（bounds）;
}
}）;
google.maps.event.addListener（map，'idle'，function（）{
showVisibleMarkers（）;
}）;
}
解决方案
到google.maps.Marker对象。标记数组中的XML标记元素没有getPosition方法（google.maps.Marker对象）。
var gmarkers = []; //在全局范围中
function showVisibleMarkers（）{
for（var i = 0; i< gmarkers.length; i ++）{
// console.log（标记物[I]）;
if（map.getBounds（）。contains（gmarkers [i] .getPosition（）））{
//显示标记的代码
}
}
}
函数displaymap（lat，lng，state，min，max）{
map = new google.maps.Map（document.getElementById（mapdiv），{
center ：new google.maps.LatLng（lat，lng），
zoom：7，
mapTypeId：'roadmap'，
panControl：true，
zoomControl：true，
streetViewControl：true，
mapTypeControl：true
}）;
var infoWindow = new google.maps.InfoWindow;
//根据您的PHP文件的名称更改此值
downloadUrl（/ inc / db_query.php？lat =+ lat +& lng =+ lng +& state = + state +& min =+ min +& max =+ max，function（data）{
var xml = data.responseXML;
var bounds = new google.maps。 LatLngBounds（）;
markers = xml.documentElement.getElementsByTagName（marker）;
for（var i = 0; i< markers.length; i ++）{
var name = markers [i] .getAttribute（name）;
var address = markers [i] .getAttribute（address）;
if（markers [i] .getAttribute（daily）=== ''）{
var icon ='/img/blackdot.png';
} else if（markers [i] .getAttribute（daily）=== 0）{
var （标记[i] .getAttribute（daily）> 0&&&&&标记[i] .getAttribute（每天）< 10）{
var icon ='/img/bluedot.png';
} else if（markers [i] .ge tAttribute（每日）> 9&&标记[i] .getAttribute（每日）< 20）{
var icon ='/img/purpledot.png';
} else if（markers [i] .getAttribute（daily）> 19&& amp; markers [i] .getAttribute（daily）< 30）{
var icon =' /img/reddot.png';
} else if（markers [i] .getAttribute（daily）> 29&&& marker [i] .getAttribute（daily）< 40）{
var icon =' /img/orangedot.png';
} else if（markers [i] .getAttribute（daily）> 39&&&& ;; markers [i] .getAttribute（daily）< 50）{
var icon =' /img/yellowdot.png';
} else if（markers [i] .getAttribute（daily）> 49）{
var icon ='/img/whitedot.png';
var position = new google.maps.LatLng（
parseFloat（markers [i] .getAttribute（lat）），
parseFloat（markers [i] .getAttribute （ LNG）））;
var html =< b> + name +< / b>< br /> +地址;
var marker = new google.maps.Marker（{
map：map，
position：position，
icon：icon
}）;
gmarkers.push（marker）; //< ---------------------------- add this line。
bindInfoWindow（marker，map，infoWindow，html）;
bounds.extend（position）;
map.fitBounds（bounds）;
}
}）;
google.maps.event.addListener（map，'idle'，function（）{
showVisibleMarkers（）;
}）;
}
I'm trying to display the visible markers in a map and can 't get this code to work. In the console it displays the marker information like I expect.
<marker name="Jolly rogers", address="1850 Scales Bend Rd" lat="41.7609" lng="-91.6574" distance="217.212"></marker>
But I get the error:
Uncaught TypeError: Object # has no method 'getPosition'
What do I have wrong?
function showVisibleMarkers() {
for (var i = 0; i < markers.length; i++) {
console.log(markers[i]);
if (map.getBounds().contains(markers[i].getPosition())) {
// code to display markers
}
}
}
Here's the code that creates the map.
function displaymap(lat, lng, state, min, max) {
map = new google.maps.Map(document.getElementById("mapdiv"), {
center: new google.maps.LatLng(lat, lng),
zoom: 7,
mapTypeId: 'roadmap',
panControl: true,
zoomControl: true,
streetViewControl: true,
mapTypeControl: true
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP file
downloadUrl("/inc/db_query.php?lat=" + lat + "&lng=" + lng + "&state=" + state + "&min=" + min + "&max=" + max, function(data) {
var xml = data.responseXML;
var bounds = new google.maps.LatLngBounds();
markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var address = markers[i].getAttribute("address");
if (markers[i].getAttribute("daily") === '') {
var icon = '/img/blackdot.png';
} else if (markers[i].getAttribute("daily") === 0) {
var icon = '/img/greendot.png';
} else if (markers[i].getAttribute("daily") > 0 && markers[i].getAttribute("daily") < 10) {
var icon = '/img/bluedot.png';
} else if (markers[i].getAttribute("daily") > 9 && markers[i].getAttribute("daily") < 20) {
var icon = '/img/purpledot.png';
} else if (markers[i].getAttribute("daily") > 19 && markers[i].getAttribute("daily") < 30) {
var icon = '/img/reddot.png';
} else if (markers[i].getAttribute("daily") > 29 && markers[i].getAttribute("daily") < 40) {
var icon = '/img/orangedot.png';
} else if (markers[i].getAttribute("daily") > 39 && markers[i].getAttribute("daily") < 50) {
var icon = '/img/yellowdot.png';
} else if (markers[i].getAttribute("daily") > 49) {
var icon = '/img/whitedot.png';
}
var position = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var html = "<b>" + name + "</b> <br/>" + address;
var marker = new google.maps.Marker({
map: map,
position: position,
icon: icon
});
bindInfoWindow(marker, map, infoWindow, html);
bounds.extend(position);
map.fitBounds(bounds);
}
});
google.maps.event.addListener(map, 'idle', function() {
showVisibleMarkers();
});
}
解决方案
You don't keep references to the google.maps.Marker objects. The XML "marker" elements in the markers array don't have a getPosition method (the google.maps.Marker objects do).
var gmarkers = []; // in the global scope
function showVisibleMarkers() {
for (var i = 0; i < gmarkers.length; i++) {
// console.log(markers[i]);
if (map.getBounds().contains(gmarkers[i].getPosition())) {
// code to display markers
}
}
}
function displaymap(lat, lng, state, min, max) {
map = new google.maps.Map(document.getElementById("mapdiv"), {
center: new google.maps.LatLng(lat, lng),
zoom: 7,
mapTypeId: 'roadmap',
panControl: true,
zoomControl: true,
streetViewControl: true,
mapTypeControl: true
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP file
downloadUrl("/inc/db_query.php?lat=" + lat + "&lng=" + lng + "&state=" + state + "&min=" + min + "&max=" + max, function(data) {
var xml = data.responseXML;
var bounds = new google.maps.LatLngBounds();
markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var address = markers[i].getAttribute("address");
if (markers[i].getAttribute("daily") === '') {
var icon = '/img/blackdot.png';
} else if (markers[i].getAttribute("daily") === 0) {
var icon = '/img/greendot.png';
} else if (markers[i].getAttribute("daily") > 0 && markers[i].getAttribute("daily") < 10) {
var icon = '/img/bluedot.png';
} else if (markers[i].getAttribute("daily") > 9 && markers[i].getAttribute("daily") < 20) {
var icon = '/img/purpledot.png';
} else if (markers[i].getAttribute("daily") > 19 && markers[i].getAttribute("daily") < 30) {
var icon = '/img/reddot.png';
} else if (markers[i].getAttribute("daily") > 29 && markers[i].getAttribute("daily") < 40) {
var icon = '/img/orangedot.png';
} else if (markers[i].getAttribute("daily") > 39 && markers[i].getAttribute("daily") < 50) {
var icon = '/img/yellowdot.png';
} else if (markers[i].getAttribute("daily") > 49) {
var icon = '/img/whitedot.png';
}
var position = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var html = "<b>" + name + "</b> <br/>" + address;
var marker = new google.maps.Marker({
map: map,
position: position,
icon: icon
});
gmarkers.push(marker); // <---------------------------- add this line.
bindInfoWindow(marker, map, infoWindow, html);
bounds.extend(position);
map.fitBounds(bounds);
}
});
google.maps.event.addListener(map, 'idle', function() {
showVisibleMarkers();
});
}
这篇关于Uncaught TypeError：Object＃< Element>没有方法'getPosition'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
