Google Mapを簡単に使おうでおなじみの「gMarker.js」ですが、
ソースコードの説明をしておきます。
なんのこと言っているの？というあなたはこちらをご覧ください。
ライセンスは「MIT」です。
ソースコード
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 |
/*! * gMarker v1.0.1 * http://himakan.net/tool/gmarker */ ( function(){ "use strict"; var gDivs = $( "[id ^= 'gmarkerDiv']" ); if ( gDivs.length > 0 ) { var apiKey = $( '#gmarkerjs' ).data( 'key' ), gMapUrl = 'https://maps.googleapis.com/maps/api/js?callback=initGMarker&key=' + apiKey; window.initGMarker = function () { $.each( gDivs, function( _, gDiv ) { var mapData = $( gDiv ).children( 'span' ), centerMarker = { lat: $( mapData[0] ).data( 'longitude' ), lng: $( mapData[0] ).data( 'latitude' ) }; // Set Map var map = new google.maps.Map( document.getElementById( gDiv.id ), { zoom: $( gDiv ).data( 'zoom' ), center: centerMarker } ); // Set Marker $.each( mapData, function( _, mData ) { var marker = new google.maps.Marker( { position: { lat: $( mData ).data( 'longitude' ), lng: $( mData ).data( 'latitude' ) }, map: map } ); // Set Icon if ( $( mData ).data( 'icon' ) ) { marker.setOptions( { icon: { url: $( mData ).data( 'icon' ), scaledSize: new google.maps.Size(35, 35) } } ) } // Set anime if ( $( mData ).data( 'anime' ) ) { marker.setAnimation( selectAnimation( $( mData ).data( 'anime' ) ) ); } // Set Event if ( $( mData ).data( 'event' ) ) { var infoWindow = new google.maps.InfoWindow( { content: unescape( $( mData ).data( 'event' ) ) } ); marker.addListener( 'click', function() { infoWindow.open( map, marker ); } ); } } ); } ); function selectAnimation(anime) { if ( anime == 'bounce' ) { return google.maps.Animation.BOUNCE } else if ( anime == 'drop' ) { return google.maps.Animation.DROP } else if ( anime == 'lo' ) { return google.maps.Animation.lo } else if ( anime == 'jo' ) { return google.maps.Animation.jo } } }; $.getScript( gMapUrl ); } } )(); |
必要そうな機能だけを実装しました。
ES5的に書いてますが、そろそろES6で書きます。すみません。
解説
なんだか今回のソースは解説するまでもないのでしません。
参考
スポンサードリンク