最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - how to show google map in webpage using jquery - Stack Overflow

programmeradmin1浏览0评论

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
Add a ment  | 

2 Answers 2

Reset to default 4

add 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.

发布评论

评论列表(0)

  1. 暂无评论