我尝试在googlemaps上制作多个标记并从数据库中获取数据。 这是我的代码
<script>
<?php
$query = $db->query('SELECT * FROM tbl_kabkot WHERE 1=1 AND latitude !=0 AND longitude !=0');
while($row = $query->fetch()){
$nama_kabkot = $row[nama_kabkot];
$longitude = $row[longitude];
$latitude = $row[latitude];
?>
var markers = [
[<?= $nama_kabkotv ?>, <?= $latitude ?>, <?= $longitude ?>]
];
<?php } ?>
function initMap() {
var latlng = new google.maps.LatLng(-33.92, 151.25);
var myOptions = {
zoom: 10,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false
};
var map = new google.maps.Map(document.getElementById("peta"),myOptions);
var infowindow = new google.maps.InfoWindow(), marker, i;
for (i = 0; i < markers.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(markers[i][1], markers[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(markers[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
}
</script>
但是此代码仅显示数据库中的一个值。 如何用数据库显示多个标记?
答案 0 :(得分:2)
由于class MyComponent extends Component {
constructor(props){
super(props)
this.state = {isAuthenticated: false};
}
render() {
return(
<div>
Hello {this.state.isAuthenticated ? 'friend' : 'stranger'} !
</div>
);
}
}
,初始sql查询有一个冗余的where
子句,但我认为这是用于测试的。原始代码中的1=1
变量在循环的每次迭代中被覆盖,因此数组只有一个项目。
markers
答案 1 :(得分:-1)
<script>
// The following example creates complex markers to indicate beaches near
// Sydney, NSW, Australia. Note that the anchor is set to (0,32) to correspond
// to the base of the flagpole.
function initMap() {
var markerscenter = [
['Bondi Beach', -33.890542, 151.274856,],
['Bondi Beach2', -33.90542, 151.2748,]
];
var map = new google.maps.Map(document.getElementById('map_canvas'), {
zoom: 10,
center: {lat:Number(markerscenter[0][0]), lng:Number(markerscenter[0][1])}
});
setMarkers(map);
}
// Data for the markers consisting of a name, a LatLng and a zIndex for the
// order in which these markers should display on top of each other.
var markers = [
['Bondi Beach', -33.890542, 151.274856,],
['Bondi Beach2', -33.90542, 151.2748,]
];
// Info Window Content
var infoWindowContent = [
'desc1','desc2'
];
function setMarkers(map) {
var image = 'markeimage.png';
var infoWindow = new google.maps.InfoWindow(), marker, i;
for (var i = 0; i < markers.length; i++) {
//var beach = beaches[i];
var marker = new google.maps.Marker({
position: {lat:Number(markers[i][0]), lng: Number(markers[i][1])},
map: map,
icon: image,
});
google.maps.event.addListener(marker, 'mouseover', (function(marker, i) {
return function() {
infoWindow.setContent(infoWindowContent[i][0]);
infoWindow.open(map, marker);
}
})(marker, i));
}
}
</script>