ﾎｰﾑﾍﾟｰｼﾞにｸﾞｰｸﾞﾙﾏｯﾌﾟを表示させるために｢jquery.gmap3.js｣を使っています｡Google Maps JavaScript API v3を使用してください｡
https://developers.google.com/maps/documentation/javascript/styling?hl=ja
ｽﾀｲﾙ情報を生成するｼﾞｪﾈﾚｰﾀまで用意されています｡
ﾏｯﾌﾟ ｽﾀｲﾙ設定ｳｨｻﾞｰﾄﾞ
http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/wizard/index.html
ｳｲｻﾞｰﾄﾞの説明画像は､こちら(http://meusonho41.com/blog/2013/09/12/591/)参考に
| ▽2
●
ぽけっとしすてむ ●500ﾎﾟｲﾝﾄ  ﾍﾞｽﾄｱﾝｻｰ |
jquery.gmap3.jsの42行目､43行目を編集します｡
function addMap($self, mpOpt) { var opt = { zoom : mpOpt.zoom, center : new google.maps.LatLng(mpOpt.latitude, mpOpt.longitude), mapTypeId : mpOpt.mapTypeId, navigationControl : mpOpt.navigationControl, mapTypeControl : mpOpt.mapTypeControl, scaleControl : mpOpt.scaleControl,//変更 styles: mpOpt.styles//追加 };
map生成前に､予め変更したいｽﾀｲﾙをJSON形式で記述します｡
var styles = [
{
stylers: [
{ "hue": "#0000ff" },
{ "saturation": -20 },
{ "lightness": 5 },
{ "gamma": 1.1 }
]
}
];
呼び出し時にstylesをｵﾌﾟｼｮﾝとして追加します｡
$("#gMap").gmap3({
address: '外神田',
zoom: 16,
navigationControl: true,
mapTypeControl: true,
scaleControl: true,
styles:styles
});
ｽﾀｲﾙが適用されます｡
