var map;
var marker = [];
var infoWindow = [];
var markerData = [ // マーカーを立てる場所名・緯度・経度
{
name: 'STWタイ支店',
lat: 13.743337,
lng: 100.545828,
icon: './images/stw_pin.png' // マーカーイメージを変更する
}, {
name: 'STWインド支店',
lat: 28.547880,
lng: 77.126029
}, {
name: 'STWスリランカ支店',
lat: 6.986819,
lng: 79.935232
}, {
name: 'STWマレーシア支店',
lat: 3.149065,
lng: 101.711714
},{
name: 'STW中国支店',
lat: 30.592364,
lng: 104.067276
}, {
name: 'STWフィリピン支店',
lat: 10.316820,
lng: 123.977697
}, {
name: 'STWインドネシア支店',
lat: -8.714815,
lng: 115.220350
}, {
name: 'STWベトナム支店',
lat: 15.876195,
lng: 108.330973
}, {
name: 'STW台北支店',
lat: 25.065963,
lng: 121.528086
}, {
name: 'STWカンボジア支店',
lat: 12.565679,
lng: 104.990963
}, {
name: 'ラオス現地ネットワーク',
lat: 19.856270,
lng: 102.495496
}, {
name: 'STWカナダ支店',
lat: 49.285721,
lng: -123.122270
}, {
name: 'STWアメリカ支店',
lat: 34.049784,
lng: -118.258232
}, {
name: 'STWペルー支店',
lat: -12.049024,
lng: -77.038453
}, {
name: 'STWメキシコ支店',
lat: 21.155366,
lng: -86.823230
}, {
name: 'STWイースター島支店',
lat: -27.112723,
lng: -109.349687
}, {
name: 'STWジャマイカ支店',
lat: 18.510182,
lng:-77.863807
}, {
name: 'STWタヒチ支店',
lat: -17.563734,
lng:-149.598809
}, {
name: 'STWパラオ支店',
lat:7.346666,
lng:134.485062
}, {
name: 'STWグアム支店',
lat:13.461318,
lng:144.683898
}, {
name: 'STWフィジー支店',
lat:-17.762183,
lng:177.450231
}, {
name: 'STWニューカレドニア支店',
lat:-22.300191,
lng:166.438255
}, {
name: 'STWニュージーランド支店',
lat:-36.847322,
lng:174.763938
}, {
name: 'バヌアツ現地ネットワーク',
lat:-15.376706,
lng:166.959158
}, {
name: 'STWモルディブ支店',
lat:4.174595,
lng:73.517756
}, {
name: 'STWイタリア支店',
lat:41.904422,
lng:12.487705
}, {
name: 'STWスペイン支店',
lat:41.401149,
lng:2.172628
}, {
name: 'STWフランス支店',
lat:48.874374,
lng:2.291632
}, {
name: 'STWドバイ支店',
lat:25.235835,
lng:55.304167
}, {
name: 'STWチェコ支店',
lat:50.091102,
lng:14.432466
}
];
function initMap() {
// 地図の作成
var mapLatLng = new google.maps.LatLng({lat: markerData[0]['lat'], lng: markerData[0]['lng']}); // 緯度経度のデータ作成
//↓↓ 追加したコード
var styles = [
{
stylers: [
{ hue: "#8c7042" },
{ lightness: 0 },
{ saturation: -70 },
{ gamma: 0.9 },
{ invert_lightness: false},
{ visibility: "simplified"}
]
}
];
//↑↑ 追加したコード
map = new google.maps.Map(document.getElementById('pin-map'), { // #pin-mapに地図を埋め込む
center: mapLatLng, // 地図の中心を指定
styles: styles, //← 追加したコード
zoom: 2 // 地図のズームを指定
});
// マーカー毎の処理
for (var i = 0; i < markerData.length; i++) {
markerLatLng = new google.maps.LatLng({lat: markerData[i]['lat'], lng: markerData[i]['lng']}); // 緯度経度のデータ作成
var markerOptions = {
map: map, // マーカーを立てる地図を指定
position: markerLatLng, // マーカーを立てる位置を指定
icon:'//stworld.jp/feature/overseas_branches/images/stw_pin.png' // マーカーを指定
};
marker[i] = new google.maps.Marker(markerOptions);// マーカーの追加
infoWindow[i] = new google.maps.InfoWindow({ // 吹き出しの追加
content: '' + markerData[i]['name'] + '
' // 吹き出しに表示する内容
});
markerEvent(i); // マーカーにクリックイベントを追加
}
// marker[0].setOptions({// TAM 東京のマーカーのオプション設定
// icon: {
// url: markerData[i]['icon']// マーカーの画像を変更
// }
// });
}
// マーカーにクリックイベントを追加
function markerEvent(i) {
marker[i].addListener('click', function() { // マーカーをクリックしたとき
infoWindow[i].open(map, marker[i]); // 吹き出しの表示
});
}