cw-seki
6/3/2016 - 7:03 AM

googleMap雛形

googleMap雛形

googlemap.html
content_copyfile_download
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"   integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
    <script src="https://maps.google.com/maps/api/js?sensor=false"></script>
</head>
<body>
	<div id="map" style="width:800px;height:400px;"></div>
    <script>
    (function() {
        if(!$('#map').length) return;

        var touch = $('html').hasClass('touch');
        // alert(touch);


        var myLatLng = {lat: 35.62982, lng: 139.794242};
        var mapOptions = {
            center: myLatLng,
            scrollwheel: false,
            zoom: 15,
            styles: [{
                stylers: [{
                    hue: '#000000'
                }, {
                    saturation: -100 // 彩度
                }, {
                    lightness: 20 // 明度
                }, {
                    gamma: 0.5 // ガンマ
                }]
            }]
        };
        if(touch) {
            mapOptions.draggable = false;
        }
        var _src = 'http://www.ebri-nopporo.com/system/wp-content/themes/ebri';
        // var markerImg = _src + "/common/images/marker.png";
        var map = new google.maps.Map(document.getElementById('map'), mapOptions);
        var marker = new google.maps.Marker({
            map: map,
            icon: markerImg,
            position: myLatLng
        });
    }());
    </script>
</body>
</html>