kana-pop回答ポイント 500pt

ホームページにグーグルマップを表示させるために「jquery.gmap3.js」を使っています。

▼jquery.gmap3.js
https://github.com/bumberboom/jquery.gmap3/blob/master/js/jquery.gmap3.js

表示される地図の色を変えようとして、コードをいじっているのですが、上手く変更されません・・・orz

表示させるマップは１つだけですので「jquery.gmap3.js」をいじっています。

修正箇所が分かる方は教えていただければ助かります。
お願い致します。m(_ _)m

※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

ログインして回答する

ベストアンサー

ぽけっとしすてむ2015/04/03 05:14:21
満足500pt

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
	});

スタイルが適用されます。

スター

1件のコメントを見る
kana-pop 2015/04/03 06:18:15

ぽけっとしすてむ様

ご回答ありがとうございます。
パーフェクトでございます。m(_ _)m

スター

その他の回答

ラフティング2015/04/03 05:03:56
0pt

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

ウイザードの説明画像は、こちら（ｈttp://meusonho41.com/blog/2013/09/12/591/）参考に

 スター

ホームページにグーグルマップを表示させるために「jquery.gmap3.js」を使っています。

ベストアンサー

ぽけっとしすてむ2015/04/03 05:14:21
満足500pt

kana-pop 2015/04/03 06:18:15

その他の回答

ラフティング2015/04/03 05:03:56
0pt

この質問へのコメント

この質問への反応（ブックマークコメント）

質問の情報

この質問のカテゴリ

この質問に含まれるキーワード

人気の質問

メニュー

PC版

ホームページにグーグルマップを表示させるために「jquery.gmap3.js」を使っています。

ベストアンサー

ぽけっとしすてむ2015/04/03 05:14:21 満足500pt

kana-pop 2015/04/03 06:18:15

その他の回答

ラフティング2015/04/03 05:03:56 0pt

この質問へのコメント

この質問への反応（ブックマークコメント）

質問の情報

この質問のカテゴリ

この質問に含まれるキーワード

人気の質問

メニュー

PC版

ぽけっとしすてむ2015/04/03 05:14:21
満足500pt

ラフティング2015/04/03 05:03:56
0pt