Google map API Study(I)

来源:互联网 发布:郑州财经校园网络管理 编辑:程序博客网 时间:2024/06/06 00:24

使用google地图

关于地图运用API许多,本姑娘就开始了google地图的学习之旅。

<html>    <head>        <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBzE9xAESye6Kde-3hT-6B90nfwUkcS8Yw&sensor=false">        </script>        <link rel="stylesheet" href="googleMap/map.css" />        <script>        /** 下方LatLng内经纬度为台湾**/            function initialize() {                var mapProp = {                    center: new google.maps.LatLng(23.886671, 121.063007),                    zoom: 8,                    mapTypeId: google.maps.MapTypeId.ROADMAP                };                var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);            }            google.maps.event.addDomListener(window, 'load', initialize);        </script>    </head>    <body>        <div class="myFirstMap" id="googleMap" style="width:400px;height:550px;"></div>        <button id="hehe" type="button" style="width: 111px;height: 60px;" onclick="get()">get</button>    </body>    <script>        function get() {            var obj = document.getElementsByClassName(".gm-style-pbc");                  obj.style.cssText = "background-color:black; display:block;color:White;             console.log(new Date() + obj);        }    </script></html>

google map api

后续章节主要开始一步步认识google map API

相应的CSS样式简单这里就不写了,接下来开始从html代码来分析google api显示地图的步骤。

原创粉丝点击