Google Map 谷歌地圖

    <script> 
        var map;
        function initMap() {            
            var position = new google.maps.LatLng(1.539187, 103.647115),
                                
            map = new google.maps.Map(document.getElementById('map'), {
                center: position,
                zoom: 15, 
                styles: [去網站弄]                
            });
         
            var marker = new google.maps.Marker({
                position: position,
                map: map,
                animation: google.maps.Animation.DROP, // BOUNCE, DROP, lo, no              
                icon: 'http://www.zoominn.com.my/i/ModuleMap_icon.png'                 
            });
            marker.addListener('click', function () {
                var ttc = document.getElementById('mapContent').cloneNode(true);
                var infoWindow = new google.maps.InfoWindow;
                infoWindow.setPosition(position);
                infoWindow.setContent(ttc);  //can put element but won't auto clone 哦
                infoWindow.open(map);                    
            });          
        }

        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.async = true;
        script.defer = true;
        script.src = 'https://maps.googleapis.com/maps/api/js?key=AIzaSyDzbTtAijGTrGdYxbU3FGuxnwwO3Vkmixg&callback=initMap'
        document.body.appendChild(script);

    </script>
    @*<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDzbTtAijGTrGdYxbU3FGuxnwwO3Vkmixg&callback=initMap" async defer></script>*@

refer : 

https://mapstyle.withgoogle.com/    (弄 style 的)

https://developers.google.com/maps/ (官網)

 

關鍵詞:script maps google map var infowindow position com new document

相關推薦:

How do I put an infoWindow on top of a custom tag&quest;

Google Maps - Custom Tile - URL-based

ArcGIS API For JavaScript 開發(五)要素圖層的編輯

高德地圖web 端智慧圍欄

如何實現一個地相簿封裝,可以快速切換地圖

Angularjs does not allow json not to work in Google Map

百度地圖使用

Repeated problem of the world in Google Maps API

Places Searches using Ionic 3, Angular 5 and Google Maps and Places APIs

地圖的折線:Polyline