个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我正在使用 PHP 和 MYSQL 来从数据库中检索数据并在 Google Map API 上显示标记，并添加一个信息窗口，其中包含使用 click-Listener 从数据库中检索到的信息。 添加信息窗口后，它似乎不起作用。
我的错误在哪里？
<?php
/*
Template Name: MAP2
*/
get_header();
?>
<!DOCTYPE html>
<html>
<head>
<title>Custom Markers</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCquey2tCZ32jLJJDEEi2D7_RnXXyj9RTI&callback=initMap">
</script>
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 600px;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="map">
<div class="map-popupstring hidden" id="popupstring1">
<div class="text-center">
<h3>title</h3>
<p>subinfo</p>
</div>
</div>
</div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: new google.maps.LatLng(33.888630, 35.495480),
mapTypeId: 'roadmap'
});
var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
var icons = {
parking: {
icon: iconBase + 'parking_lot_maps.png'
},
library: {
icon: iconBase + 'library_maps.png'
},
info: {
icon: iconBase + 'info-i_maps.png'
}
};
var $popup = $("#popupstring1")
function addMarker(feature) {
var marker = new google.maps.Marker({
position: feature.position,
//icon: icons[feature.type].icon,
data-popupstring-id: $popup,
map: map
});
}
var features = [
<?php
global $wpdb;
$prependStr ="";
foreach( $wpdb->get_results("SELECT siteID, latitude, longitude FROM site_coordinates2", OBJECT) as $key => $row) {
$latitude = $row->latitude;
$longitude = $row->longitude;
$info = $row->siteID;
echo $prependStr;
?>
{
position: new google.maps.LatLng(<?php echo $latitude; ?>, <?php echo $longitude; ?>),
type: '<?php echo $info; ?>'
}
<?php
$prependStr =",";
}
?>
];
var infowindow = new google.maps.InfoWindow();
for (var i = 0, feature; feature = features[i]; i++) {
addMarker(feature);
}
}
</script>
</body>
</html>
<?php
get_footer();
?>
最佳答案
<div class="map-popupstring hidden" id="popupstring1">
<div class="text-center">
<h3>title</h3>
<p>subinfo</p>
</div>
</div>
您必须在 html 标签中放入想要的弹出窗口。和谷歌地图标签中的代码来初始化它。并使用 data-popupstring-id="#popupstring1" 标签在点击标记时对其进行初始化。
var $popup = $("#popupstring1")
function addMarker(feature) {
var marker = new google.maps.Marker({
position: feature.position,
data-popupstring-id: $popup,
map: map
});
}
关于javascript - 在谷歌地图中点击标记添加信息窗口，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42627471/
25
4
0
我需要你的帮助!我在它们之间放置了随机数量的 div。 Item description Item description Item description Item
我有两个 NSDates，时间格式为“h:mm a”(即 6:00 AM 和 8:00 PM)。 我试图找出这两个时间之间的中点是什么时间。 对于上面的示例，早上 6:00 和晚上 8:00 之间的中
关闭。此题需要details or clarity 。目前不接受答案。 想要改进这个问题吗？通过 editing this post 添加详细信息并澄清问题. 已关闭 8 年前。 Improve th
我正在寻找一种有效的算法来检查一个点是否在 3D 中的另一个点附近。 sqrt((x2-x1)^2 + (y2-y1)^2 + (z2-z1)^2) < radius 这似乎并不太快，实际上我不需要这
我可以让 pandas cut/qcut 函数返回 bin 端点或 bin 中点而不是一串 bin 标签吗？ 目前 pd.cut(pd.Series(np.arange(11)), bins = 5)
我是一名优秀的程序员,十分优秀！