I want to display google map in page load that why i m using window.onload Function.I am passing latitude and longitude as static,and try to show in a div with an id ="map_canvas".But nothing is shown on webpage. Where M i making mistake.Here is my code.I am unable to fetch Google Map in my webpage.
Here is the java script.
<script type="text/javascript"
src="">
</script>
<script>
window.onload = function WindowLoad(event) {
var myLatlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
</script>
this is my Html Code.
<div id="map_canvas"></div>>
I want to display google map in page load that why i m using window.onload Function.I am passing latitude and longitude as static,and try to show in a div with an id ="map_canvas".But nothing is shown on webpage. Where M i making mistake.Here is my code.I am unable to fetch Google Map in my webpage.
Here is the java script.
<script type="text/javascript"
src="http://maps.google./maps/api/js?sensor=true">
</script>
<script>
window.onload = function WindowLoad(event) {
var myLatlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
</script>
this is my Html Code.
<div id="map_canvas"></div>>
Share
Improve this question
asked Feb 11, 2016 at 6:14
gaurav bhattgaurav bhatt
232 silver badges12 bronze badges
3
- did u check any error in console? – Banik Commented Feb 11, 2016 at 6:21
- yes i did but there is no error, i m getting the value in map variable but i didn't understand how should i use the var map to make this code work – gaurav bhatt Commented Feb 11, 2016 at 6:29
- My code is working properly now....i was missing style in my div....thnku – gaurav bhatt Commented Feb 11, 2016 at 6:55
2 Answers
Reset to default 4add height and width to the map_canvas div and then check...
<div id="map_canvas" style="width:500px;height:380px;"></div>
You are missing the Google API key in the query parameter. Your script tag should be something like this:
src="http://maps.googleapis./maps/api/js?key=AIzaSyBeEeKz4H-KQTFABe1UTs9h5KUlpqsZ10Q&sensor=false"
You can register for a free Google map API key, which gives about 10,000 free hits everyday, good enough for practice purposes.