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 map maps google var com position infowindow gt document

相關推薦:

Google Maps InfoWindow with AJAX - & ldquo&semi; Uncaught TypeError&colon; Object &num; & l...

Adding Multiple Markers with Info Windows to Google Maps Dynamically from Database

Google Map does not appear in the page

Toggle display &sol; hide Google Map Markers

How to Create a Custom-styled Google Map in React

Responsive google map in zurb foundation 3

Animate Marker In Google Map Using Bootstrap In ASP.NET MVC

CSS3 rounded corner with google map

Add information for multiple markers from dynamic content

Migrating from Google Maps JavaScript API to ArcGIS API for JavaScript