not displaying markers whats the error..? - google-maps

Question

Map markers not displaying at all whats the error m using lat long from the database
<script>
function initialize() {
var myLatlng = new google.maps.LatLng(<?PHP echo json_encode($output,JSON_NUMERIC_CHECK)?>);
var poss = new google.maps.LatLng(15,78);
var mapOptions = {
zoom: 4,
center: poss
}
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
for(i = 0;i < myLatlng.length;i++ ) {
var marker = new google.maps.Marker({
position:new google.maps.LatLng( myLatlng[i][0], myLatlng[i][1]),
map: map,
});
};
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>

Answer 1

Your problem is the definition of the myLatlng array. Remove the google.maps.LatLng from around that array (a google.maps.LatLng takes two numbers, not an array).
<script>
function initialize() {
var myLatlng = <?PHP echo json_encode($output,JSON_NUMERIC_CHECK)?>;
var poss = new google.maps.LatLng(15,78);
var mapOptions = {
zoom: 4,
center: poss
}
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
for(i = 0;i < myLatlng.length;i++ ) {
var marker = new google.maps.Marker({
position:new google.maps.LatLng( myLatlng[i][0], myLatlng[i][1]),
map: map,
});
};
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
working code snippet (no PHP):
var myLatlng = [
[8.6, 105.65],
[14, 109.38],
[16.83, 108.62],
[8.3, 104.88],
[8.97, 106.88]
];
function initialize() {
var poss = new google.maps.LatLng(15, 78);
var mapOptions = {
zoom: 4,
center: poss
};
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
var bounds = new google.maps.LatLngBounds();
for (i = 0; i < myLatlng.length; i++) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(
myLatlng[i][0],
myLatlng[i][1]),
map: map,
});
bounds.extend(marker.getPosition());
}
map.fitBounds(bounds);
}
google.maps.event.addDomListener(window, 'load', initialize);
body,
html,
#map_canvas {
height: 100%;
width: 100%;
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>