var apikey = "AIzaSyCSm3c0P1XI8eds-1eT1KBbDRL78GVUrwk";
document.write("<script src='https://maps.googleapis.com/maps/api/js?key="+apikey+"'></script>");

$(function(){
	var infowindow = new google.maps.InfoWindow();
	/*$('body').append('<div class="remodal" data-remodal-id="modal" data-remodal-options="hashTracking:false"><button data-remodal-action="close" class="remodal-close"></button><div id="photoBox"></div></div>');*/
});

var map;
var marker = [];
var infoWindow = [];
var markerData = [
	{num: '1',name: 'JR西船橋駅 北口',lat: 35.708046,lng: 139.958859},
	{num: '2',name: 'JR西船橋駅 南口',lat: 35.707141,lng: 139.958587}
];

function initialize(point) {
	if(!point){
		point = 0;
	}

		//初期設定
		var init = {
			zoom: 17,
			center: new google.maps.LatLng(markerData[point]['lat'], markerData[point]['lng']),
			mapTypeId: google.maps.MapTypeId.ROADMAP,
			scrollwheel: false,
		};
		map_base = new google.maps.Map(document.getElementById("gmap"), init); //マップの出力先

		//マップのスタイル
		/*var styleOptions = [
			{featureType: "all",					stylers: [ { hue: "#ffcc00" }, { saturation: -70 } ]},
			{featureType: "transit",			stylers: [ { hue: "#ff3300" } ]},
			{featureType: "road.highway",	stylers: [ { hue: "#11ff00" } ]}
		];
		var cpsType = new google.maps.StyledMapType(styleOptions);
		
		var customMapTypeId = 'custom_style';
		map_base.mapTypes.set(customMapTypeId, cpsType);
		map_base.setMapTypeId(customMapTypeId);*/

		/* レスポンシブ対応 */
		google.maps.event.addDomListener(window, "resize", function() {
			var center = map_base.getCenter();
			google.maps.event.trigger(map_base, "resize");
			map_base.setCenter(center); 
		});

		cMarkers();

		/*
		// ラインを引く座標の配列を作成
		var points_root = [
			new google.maps.LatLng(34.697593, 135.533794),
			new google.maps.LatLng(34.697787, 135.533717),
			new google.maps.LatLng(34.698617, 135.533404),
			new google.maps.LatLng(34.698837, 135.534489),
			new google.maps.LatLng(34.698947, 135.535001),
			new google.maps.LatLng(34.698958, 135.535058)
		];
		
		// ラインを作成
		var polyLineOptions_root = {
			path: points_root, //先ほど設定したルート
			strokeWeight: 8, //線の太さ
			strokeColor: "#ffd800", //線の色
			strokeOpacity: "0.8" //線の透明度
		}; 
		
		var poly_root = new google.maps.Polyline(polyLineOptions_root);
		//1つ目のルートをマップに設定
		poly_root.setMap(map_base);
		*/
		
		/*
		// 01 JR京橋駅北口の改札をでて右手に宝くじ売り場がございます。こちらよりお電話ください。
		var point = new google.maps.LatLng(34.697593, 135.533794);　//地点の緯度経度
		var info = '';　//マーカークリック時情報ウィンドウ有無（noneで非表示）
		var img = new google.maps.MarkerImage('../img/area/rv_route01.png',new google.maps.Size(40,36),
		new google.maps.Point(0,0),
		new google.maps.Point(25,0));　//マーカーアイコン設定
		var ZIndex = 99;　//マーカーの重なり順
		var marker = create_maker(info, point, img, ZIndex, "<img src='../img/area/kb/r01.jpg' width='630' height='630' alt=''><p>JR京橋駅北口の改札をでて右手に宝くじ売り場がございます。こちらよりお電話ください。</p>");　//情報ウィンドウ

		// 02 宝くじ売り場を抜けますと、喫茶店「平野屋」が正面に見えます。そこを左に曲がってアーケード内を直進しますと、右手にグランシャトーがございます。そのまま直進してください。
		var point = new google.maps.LatLng(34.697787, 135.533717);
		var info = '';
		var img = new google.maps.MarkerImage('../img/area/route02.png',new google.maps.Size(40,36),
		new google.maps.Point(0,0),
		new google.maps.Point(15,36));
		var ZIndex = 0;
		var marker = create_maker(info, point, img, ZIndex, "<img src='../img/area/kb/r02.jpg' width='630' height='630' alt=''><p>宝くじ売り場を抜けますと、喫茶店「平野屋」が正面に見えます。そこを左に曲がってアーケード内を直進しますと、右手にグランシャトーがございます。そのまま直進してください。</p>");

		// 03 広い道にでて、右の角にジャンボカラオケ広場がございます。（左をご覧頂くとJR京橋駅の高架が見えます。）信号を渡らずに、ジャンボカラオケ広場側に曲がってください。
		var point = new google.maps.LatLng(34.698617, 135.533404);
		var info = '';
		var img = new google.maps.MarkerImage('../img/area/route03.png',new google.maps.Size(40,36),
		new google.maps.Point(0,0),
		new google.maps.Point(15,36));
		var ZIndex = 0;
		var marker = create_maker(info, point, img, ZIndex, "<img src='../img/area/kb/r03.jpg' width='630' height='630' alt=''><p>広い道にでて、右の角にジャンボカラオケ広場がございます。（左をご覧頂くとJR京橋駅の高架が見えます。）信号を渡らずに、ジャンボカラオケ広場側に曲がってください。</p>");

		// 04 そのまま国道1号線を道なりに直進。右手に天下一品、さらにパチンコ屋さんも過ぎさらに進みます。
		var point = new google.maps.LatLng(34.698837, 135.534489);
		var info = '';
		var img = new google.maps.MarkerImage('../img/area/route04.png',new google.maps.Size(40,36),
		new google.maps.Point(0,0),
		new google.maps.Point(15,36));
		var ZIndex = 0;
		var marker = create_maker(info, point, img, ZIndex, "<img src='../img/area/kb/r04.jpg' width='630' height='630' alt=''><p>そのまま国道1号線を道なりに直進。右手に天下一品、さらにパチンコ屋さんも過ぎさらに進みます。</p>");

		// 05 DVDの桃太郎が見えます。その手前のレンガ作りのビルの2階がただいま京橋店です。
		var point = new google.maps.LatLng(34.698947, 135.535001);
		var info = '';
		var img = new google.maps.MarkerImage('../img/area/rv_route05.png',new google.maps.Size(40,36),
		new google.maps.Point(0,0),
		new google.maps.Point(25,0));
		var ZIndex = 0;
		var marker = create_maker(info, point, img, ZIndex, "<img src='../img/area/kb/r05.jpg' width='473' height='630' alt=''><p>DVDの桃太郎が見えます。その手前のレンガ作りのビルの2階がただいま京橋店です。</p>");

		// 06 店舗前
		var point = new google.maps.LatLng(34.698919, 135.535091);
		var info = 'none';
		var img = new google.maps.MarkerImage('../img/area/flag_kyobashi.png',new google.maps.Size(86,106),
		new google.maps.Point(0,0),
		new google.maps.Point(20,106));
		var ZIndex = 0;
		var marker = create_maker(info, point, img, ZIndex, "<div class='infobox'><div class='photo'><iframe src='https://www.google.com/maps/embed?pb=!1m0!3m2!1sja!2sjp!4v1460615564498!6m8!1m7!1sLI7_Az9XOI5sDHl6gDe-tA!2m2!1d34.69904493400465!2d135.5351286057833!3f196.9662318291402!4f8.345172209489064!5f0.7820865974627469' width='300' height='240' frameborder='0' style='border:0'></iframe></div></div>");
		*/
}

function cMarkers(){
	for (var i = 0; i < markerData.length; i++) {
		markerLatLng = new google.maps.LatLng({lat: markerData[i]['lat'], lng: markerData[i]['lng']}); // 緯度経度のデータ作成
		marker[i] = new google.maps.Marker({ // マーカーの追加
			position: markerLatLng, // マーカーを立てる位置を指定
			/*label: {
				color: "black" ,	// ラベルの色
				fontWeight: "bold" ,	// 文字の太さ
				text: markerData[i]['num'],		// 文字
			},*/
			map: map_base // マーカーを立てる地図を指定
		});
		infoWindow[i] = new google.maps.InfoWindow({ // 吹き出しの追加
				content: '<div>' + markerData[i]['name'] + '</div>' // 吹き出しに表示する内容
		});
		markerEvent(i); // マーカーにクリックイベントを追加
	}
}

// マーカーにクリックイベントを追加
function markerEvent(i) {
	marker[i].addListener('click', function() { // マーカーをクリックしたとき
		infoWindow[i].open(map_base, marker[i]); // 吹き出しの表示
	});
}

/*
// マーカーを生成
function create_maker(info, latlng, img, ZIndex, html) {
	var marker = new google.maps.Marker({
		position: latlng,　//各ルートの緯度経度
		map: map_base,　//設定するマップ
		icon: img,　//各マーカーのアイコン
		zIndex: ZIndex,　//各マーカーの重ね順
		animation: google.maps.Animation.DROP　//マーカーが上から落ちてくるアニメーション
	});
	// マーカーをクリックした時の処理
	google.maps.event.addListener(marker, "click", function() {
		if (info == 'none'){
		}else{
			// infowindow.setContent(html);
			// infowindow.open(map_base, marker);
			$('#photoBox').html(html);
			$('[data-remodal-id=modal]').remodal().open();
		}
	});
}
*/