Google Mapの覚書 | ワクガンス

GMapを画像にして自サーバーに保存する

gmaps.jsを使って、gmapの静的URLを取得し、AjaxでPHP側（自サーバー）へ送る。
PHP側で送られてきたURLを元に地図画像を自サーバーに作成する。

HTMLソース

	～略～
	<script src="jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=○○○○&sensor=false"></script>
	<script src="gmaps.js"></script>

	～略～

	<div>
		<input type="button" value="保存実行" onclick="test1()" /><br>
		<img id="img1" src="" />
	</div>

	～略～
	

JSソース

	function test1(){

		var gmap_url = GMaps.staticMapURL({
			  size: [500, 500],
			  lat: 26.651139717347082,
			  lng: 127.94837594032288,

			});

		//サーバーサイドURL
		var url='php/save_gmap_to_myserver.php';

		//サンプルデータ
		var ary=new Array();
		ary[0]=gmap_url;


		$.post(
		url ,
		{"ary" : ary} ,
			function(msg){
				$("#img1").attr('src',"php/img/test.png");//自サーバーに保存した画像を表示
				alert(msg);

			}
		).error(function() {//PHP側で何らかのバグ発生。存在しないURLを指定したりすると発生。

			alert('サーバーサイドのエラー');
		});
	}
	

PHPソース(save_gmap_to_myserver.php)

	$url =$_POST['ary'][0];

	//自サーバー内に画像ファイルを作成
	$data = file_get_contents($url);
	file_put_contents('img/test.png',$data);
	echo "success";
	

サンプル
2015-6-9

各種コントローラの無効化

	var latlng = new google.maps.LatLng(m_data.mm_lat,m_data.mm_lng);
	var opts = {
		zoom: 17,//ズーム
		center: latlng,
		mapTypeId: google.maps.MapTypeId.ROADMAP,
		scaleControl: false,	//スケール無効化
		scrollwheel: false,		//マウスホイールによる拡大縮小を無効化
		draggable: false,		//ドラッグ移動を無効化
		disableDoubleClickZoom:true,//ダブルクリックズームを無効
		panControl:false,		//移動コントロールを無効化
		zoomControl:false,		//拡大縮小バーを無効化
		mapTypeControl:false,	//航空写真切替を無効化
		streetViewControl:false,//ストリートビューを無効化
	};
	m_map = new google.maps.Map(document.getElementById("gmap"), opts);
	

参考
2015-6-9

GMAPからKMLをダウンロードする方法

URLをいじると直接ダウンロードできる
数字の羅列の後に「&output=kml&ge_fileext=.kml」を追加


2012-1-31

Google Mapのピン付きリンクを作成

	https://maps.google.com/maps?q=26.6744943,127.9041231
	

検証:ウフグシムイ

iframeに埋め込むバージョン

	<iframe src="http://maps.google.co.jp/maps?&output=embed&q=loc:26.6744943,127.9041231&z=15&hl=en" width="640" height="480" frameborder="0" style="border:0" allowfullscreen></iframe>
	

Google Map へのリンクを設置する

2019-1-26 | 2019-2-6

地図を翻訳する

「hl=en」をURLに付加すると地図は英語表記になる。
APIによってはlang=enとするケースもあり。

	<iframe id="map_iframe" src="http://maps.google.co.jp/maps?&output=embed&q=loc:26.6760075,127.900064&z=15&hl=en"
		 width="640" height="480" frameborder="0" style="border:0" allowfullscreen ></iframe>
	

2019-2-4

xxx