谷歌地图标记不显示JavaScript

我的地图加载器很完美，但我的标记不会出现

我不太明白为什么会这样

编辑1：

以下是整个功能，我希望它能帮助回答您的一些问题：

var marker = new google.maps.Marker({
    map: map,
    position: point,
    icon: 'pointer.png',
    title: "test"
});

函数initMap（）{
map=new google.maps.map（document.getElementById（'map'）{
缩放：16，
中心：新google.maps.LatLng（，），
});
var infoWindow=new google.maps.infoWindow；
//根据PHP或XML文件的名称进行更改
下载URL（'http://xxx.esy.es/test/test-marker.php，函数（数据）{
var xml=data.responseXML；
var markers=xml.documentElement.getElementsByTagName（'marker'）；
Array.prototype.forEach.call（markers，function（markereem））{
var name=markerem.getAttribute（'username'）；
var address=markerem.getAttribute（'address'）；
var point=new google.maps.LatLng(
parseFloat（markerem.getAttribute（'latitude'）），
parseFloat（markerem.getAttribute（'longitude'））；
var infowincontent=document.createElement（'div'）；
var strong=document.createElement（'strong'）；
strong.textContent=名称
infowincontent.appendChild（强）；
infowincontent.appendChild（document.createElement（'br'））；
var text=document.createElement（'text'）；
text.textContent=地址
infowincontent.appendChild（文本）；
var marker=new google.maps.marker({
地图：地图，
位置:点,，
图标：“pointer.png”，
标题：“测试”
});
marker.addListener（'click'，function（））{
setContent（infowincontent）；
信息窗口。打开（地图、标记）；
});
});
});
}

编辑2

这里是我的xml代码，它工作得很好！只是我在地图上的标记不起作用

 function initMap() {
     map = new google.maps.Map(document.getElementById('map'), {
         zoom: 16,
         center: new google.maps.LatLng(<?php echo $userRow['latitude']; ?>, <?php echo $userRow['longitude']; ?>),
     });
     var infoWindow = new google.maps.InfoWindow;

     // Change this depending on the name of your PHP or XML file
     downloadUrl('http://xxx.esy.es/test/test-marker.php', function(data) {
         var xml = data.responseXML;
         var markers = xml.documentElement.getElementsByTagName('marker');
         Array.prototype.forEach.call(markers, function(markerElem) {
             var name = markerElem.getAttribute('username');
             var address = markerElem.getAttribute('address');
             var point = new google.maps.LatLng(
                 parseFloat(markerElem.getAttribute('latitude')),
                 parseFloat(markerElem.getAttribute('longitude')));

             var infowincontent = document.createElement('div');
             var strong = document.createElement('strong');
             strong.textContent = name
             infowincontent.appendChild(strong);
             infowincontent.appendChild(document.createElement('br'));

             var text = document.createElement('text');
             text.textContent = address
             infowincontent.appendChild(text);
             var marker = new google.maps.Marker({
                 map: map,
                 position: point,
                 icon: 'pointer.png',
                 title: "test"
             });
             marker.addListener('click', function() {
                 infoWindow.setContent(infowincontent);
                 infoWindow.open(map, marker);
             });
         });
     });
 }

试试这个：

给你的部门打电话

<?php
include_once 'test-dbconnect.php';
function parseToXML($htmlStr)
{
$xmlStr=str_replace('<','&lt;',$htmlStr);
$xmlStr=str_replace('>','&gt;',$xmlStr);
$xmlStr=str_replace('"','&quot;',$xmlStr);
$xmlStr=str_replace("'",'&#39;',$xmlStr);
$xmlStr=str_replace("&",'&amp;',$xmlStr);
return $xmlStr;
}


header("Content-type: text/xml");

// Start XML file, echo parent node
echo '<markers>';

 $sql = "select * from tbl_users";
    $result = mysqli_query($DBcon, $sql) or die("Error in Selecting " . mysqli_error($DBcon));

    //create an array
    $emparray = array();
    while($row =mysqli_fetch_assoc($result))
    {
        $emparray[] = $row;

  echo '<marker ';
  echo 'name="' . parseToXML($row['username']) . '" ';
  echo 'address="' . parseToXML($row['address']) . '" ';
  echo 'lat="' . $row['latitude'] . '" ';
  echo 'lng="' . $row['longitude'] . '" ';
  echo '/>';
}


    //close the db connection
    mysqli_close($DBcon);

// End XML file
echo '</markers>';

?>

并放置标记属性和图标，使用JSON进行尝试：

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

$。每个（数据、功能（i、项）{
var marker=new google.maps.marker({
“位置”：新的google.maps.LatLng（item.GeoLong，item.GeoLat），
“地图”：地图，
“标题”：item.PlaceName
});
//设置图标
marker.setIcon（'http://maps.google.com/mapfiles/ms/icons/yellow-dot.png')
//输入关于每个json对象的一些信息——在本例中是开放时间。
var infowindow=new google.maps.infowindow({
内容：“\n\”+item.PlaceName+”
});
//最后，将一个“OnClick”监听器连接到地图上，这样当点击标记针时，它就会弹出信息窗口！
google.maps.event.addListener（标记，'click'，函数（）{
信息窗口。打开（地图、标记）；
});
})

试试这个：

给你的部门打电话

<?php
include_once 'test-dbconnect.php';
function parseToXML($htmlStr)
{
$xmlStr=str_replace('<','&lt;',$htmlStr);
$xmlStr=str_replace('>','&gt;',$xmlStr);
$xmlStr=str_replace('"','&quot;',$xmlStr);
$xmlStr=str_replace("'",'&#39;',$xmlStr);
$xmlStr=str_replace("&",'&amp;',$xmlStr);
return $xmlStr;
}


header("Content-type: text/xml");

// Start XML file, echo parent node
echo '<markers>';

 $sql = "select * from tbl_users";
    $result = mysqli_query($DBcon, $sql) or die("Error in Selecting " . mysqli_error($DBcon));

    //create an array
    $emparray = array();
    while($row =mysqli_fetch_assoc($result))
    {
        $emparray[] = $row;

  echo '<marker ';
  echo 'name="' . parseToXML($row['username']) . '" ';
  echo 'address="' . parseToXML($row['address']) . '" ';
  echo 'lat="' . $row['latitude'] . '" ';
  echo 'lng="' . $row['longitude'] . '" ';
  echo '/>';
}


    //close the db connection
    mysqli_close($DBcon);

// End XML file
echo '</markers>';

?>

并放置标记属性和图标，使用JSON进行尝试：

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

$。每个（数据、功能（i、项）{
var marker=new google.maps.marker({
“位置”：新的google.maps.LatLng（item.GeoLong，item.GeoLat），
“地图”：地图，
“标题”：item.PlaceName
});
//设置图标
marker.setIcon（'http://maps.google.com/mapfiles/ms/icons/yellow-dot.png')
//输入关于每个json对象的一些信息——在本例中是开放时间。
var infowindow=new google.maps.infowindow({
内容：“\n\”+item.PlaceName+”
});
//最后，将一个“OnClick”监听器连接到地图上，这样当点击标记针时，它就会弹出信息窗口！
google.maps.event.addListener（标记，'click'，函数（）{
信息窗口。打开（地图、标记）；
});
})

检查“地图”是否在范围内

另外，将此代码保留在映射的空闲事件中：

 $.each(data, function (i, item) {
            var marker = new google.maps.Marker({
                'position': new google.maps.LatLng(item.GeoLong, item.GeoLat),
                'map': map,
                'title': item.PlaceName
            });

            // Set Icon

            marker.setIcon('http://maps.google.com/mapfiles/ms/icons/yellow-dot.png')

            // put in some information about each json object - in this case, the opening hours.
            var infowindow = new google.maps.InfoWindow({
                content: "<div class='infoDiv'>\n\<h2 class='text-center'>" + item.PlaceName + "</h2></div></div>"
            });

            // finally hook up an "OnClick" listener to the map so it pops up out info-window when the marker-pin is clicked!
            google.maps.event.addListener(marker, 'click', function () {
                infowindow.open(map, marker);
            });

        })

---

检查“地图”是否在范围内

另外，将此代码保留在映射的空闲事件中：

 $.each(data, function (i, item) {
            var marker = new google.maps.Marker({
                'position': new google.maps.LatLng(item.GeoLong, item.GeoLat),
                'map': map,
                'title': item.PlaceName
            });

            // Set Icon

            marker.setIcon('http://maps.google.com/mapfiles/ms/icons/yellow-dot.png')

            // put in some information about each json object - in this case, the opening hours.
            var infowindow = new google.maps.InfoWindow({
                content: "<div class='infoDiv'>\n\<h2 class='text-center'>" + item.PlaceName + "</h2></div></div>"
            });

            // finally hook up an "OnClick" listener to the map so it pops up out info-window when the marker-pin is clicked!
            google.maps.event.addListener(marker, 'click', function () {
                infowindow.open(map, marker);
            });

        })

在XML中：

var marker = null;
google.maps.event.addListener(map, 'idle', function() {


   marker = new google.maps.Marker({
        map: map,
        position: point,
        icon: 'pointer.png',
        title: "test"
   });
});

您使用的是

lat

和

latitude

，

lng

和

经度

，

名称

和

用户名

。因此，请确保使用正确的属性

---

通过在JS中使用以下简单行，您可以轻松调试代码：

markerElem.getAttribute('latitude')

并观看javascript控制台（在Chrome或Firefox等像样的浏览器中）。如果您不知道它在哪里，请查看您的浏览器文档。

在您的XML中：

var marker = null;
google.maps.event.addListener(map, 'idle', function() {


   marker = new google.maps.Marker({
        map: map,
        position: point,
        icon: 'pointer.png',
        title: "test"
   });
});

您使用的是

lat

和

latitude

，

lng

和

经度

，

名称

和

用户名

。因此，请确保使用正确的属性

---

通过在JS中使用以下简单行，您可以轻松调试代码：

markerElem.getAttribute('latitude')

---

并观看javascript控制台（在Chrome或Firefox等像样的浏览器中）。如果您不知道它在哪里，请检查您的浏览器文档。

您是否抛出任何javascript错误？你确定你的映像路径正确吗？我没有收到任何错误，是的，我确定我的映像路径正确。将给定的代码保持在映射“空闲”事件上映射什么是

map

？什么是

点

？这段代码在哪里执行？（）请提供一个演示该问题的示例。使用您的javascript控制台！并调试您的代码。

point

是您所期望的吗？

'pointer.png'

是否可用（意味着它与您的javascript文件位于同一目录下）？等等，您是否抛出任何javascript错误？你确定你的映像路径正确吗？我没有收到任何错误，是的，我确定我的映像路径正确。将给定的代码保持在映射“空闲”事件上映射什么是

map

？什么是

点

？这段代码在哪里执行？（）请提供一个演示该问题的示例。使用您的javascript控制台！并调试您的代码。是

poi吗