ソース掲示板




すべてから検索

キーワード   条件 表示 現行ログ 過去ログ トピックス 名前 本文
Google Map JavaScript ツール利用サンプル ( No.0 )
日時: 2018/02/02 17:46
名前: lightbox



拡張子:
JavaScript を組み込むだけで、どこにでも Google MAP を実装できます。
以下は、デフォルトでは"大阪城" という文字列で決定された場所ですが、入力値(基本は住所)によって変わります。
拡張子:
フキダシには、あらかじめ <PRE> をセットしてあるので、\n や \t が有効です
フキダシの中ではシングルクォートは使わないで下さい。
拡張子:
<SCRIPT 
	language="javascript"
	type="text/javascript"
	src="http://lightbox.in.coocan.jp/ggmap.js">
</SCRIPT>
<INPUT type="button" value="表示" onClick='LoadGGMap_01();'>
<INPUT type="text" name="ggTarget">
<DIV id="ggmap_01" style='position:relative;margin:10px'></DIV>
<SCRIPT language="javascript" type="text/javascript">

	// オブジェクト作成
	var g = new ggmap("ggmap_01");

function LoadGGMap_01() {
	// 拡大
	g.setZoom( 19 );

	// フレームの大きさ
	g.setWidth( 600 );
	g.setHeight( 400 );

	// タイプ( 1:通常,2:サテライト,3:ハイブリッド )
	g.setType( 1 );

	// 小さい地図 ( yes, no )
	g.useSmallMap( "yes" );

	strMessage = "ここに集まるよう言ったはずなんだけどね。\n";
	strMessage += "いったいどうしてだれも来ないんだろう・・・\n";
	strMessage += '\n\t<IMG src="http://lightbox.on.coocan.jp/image/ghost_11.gif" border="0">';
	g.setMessage( strMessage  );

	if ( document.getElementsByName("ggTarget")[0].value == '' ) {
		g.setAddress( "大阪城" );
	}
	else {
		g.setAddress( document.getElementsByName("ggTarget")[0].value );
	}

	// ロード時にメッセージを表示するかどうか( on, off )
	g.initMarker( "on" );

	g.apply();

	str = "<br><b>場所を指定して緯度・経度が決定されます</b>";
	g.setComment(str);
}

</SCRIPT>