Exemple d'application cartographique de l'API Google Maps compétences Sharing

Exemple d'application cartographique de l'API Google Maps compétences Sharing_Javascript

WBOY

Libérer： 2016-05-16 16:33:04

original

1414 Les gens l'ont consulté

Effet (testé dans la nouvelle version de Firefox) :

Code :

<!DOCTYPE><br><html><br><head><br>  <meta http-equiv="content-type" content="text/html;charset=utf-8"><br>  <title>Google Map</title><br>  <script type="text/javascript" src="http://maps.google.com/maps/api/js&#63;sensor=false"></script><br>  <script type="text/javascript"><br>    function init()<br>    {<br>      // 获取当前位置<br>      navigator.geolocation.getCurrentPosition(function(position)<br>        {<br>          var coords = position.coords;<br>          // 设定地图参数，将当前位置的经纬度设置为中心点<br>          var latlng = new google.maps.LatLng(coords.latitude,coords.longitude);<br>          var myOptions = <br>          {<br>            // 放大倍数<br>            zoom:14, <br>            // 标注坐标<br>            center:latlng,<br>            // 地图类型<br>            mapTypeId:google.maps.MapTypeId.ROADMAP<br>          };<br>          var map1;<br>          // 显示地图<br>          map1 = new google.maps.Map(document.getElementById('map'),myOptions);<br>          // 创建标记<br>          var marker = new google.maps.Marker(<br>            {<br>              position:latlng,<br>              map:map1<br>            });<br>          // 设定标注窗口，附上注释文字<br>          var infowindow = new google.maps.InfoWindow(<br>            {<br>              content:"当前位置"<br>            });<br>          // 打开标注窗口<br>          infowindow.open(map1,marker);<br>        });<br>    }<br>  </script><br></head><br><body onload="init()"><br>  <div id="map"></div><br></body><br></html>

Copier après la connexion

API JavaScript Google Maps v3 (documentation de référence) : https://developers.google.com/maps/documentation/javascript/basics

Document de référence de l'API Baidu Map : http://developer.baidu.com/map/jsmobile.htm

Php8, je viens aussi

Apprenez la mise en page d'un site Web en 30 minutes

Tutoriel vidéo Shangguan Oracle débutant à compétent

Votre première ligne de code UNI-APP

Flutter de zéro au lancement de l'application

Brother Lian Nouveau didacticiel vidéo Linux

Tutoriel vidéo AXURE 9 (convient à l'interface utilisateur interactive de conception de produits du chef de produit)

Tutoriel vidéo PS Zero Basic Proficiency

Tutoriel vidéo de 16 jours sur l'interface utilisateur pour vous aider à démarrer

Tutoriel vidéo sur les techniques PS et les techniques de découpage

Tutoriel vidéo sur la construction et le lancement de projets d'Alibaba Cloud Environment

Présentation des réseaux informatiques - Connaissances de base que les programmeurs doivent maîtriser

Tutoriel essentiel pour les programmeurs - Explication du protocole HTTP

Tutoriel vidéo Websocket

Exemple d'application cartographique de l'API Google Maps compétences Sharing_Javascript