kamap_sample.htmlをみてみましょう。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>kamap sample</title>
<!-- 基本のデザインを設定しています -->
<link rel="stylesheet" href="theme/default/style.css" type="text/css" />
<!-- 地図のデザインを設定しています -->
<style type="text/css">
#map {
width: 512px;
height: 512px;
border: 1px solid black;
}
</style>
<!-- OpenLayersライブラリの読み込み -->
<script src="lib/OpenLayers.js"></script>
<!-- 地図の表示スクリプト -->
<script type="text/javascript">
var map; //宣言
function init(){ //ウィンドウを読み込んだときに実行される関数
map = new OpenLayers.Map('map'); //ページに地図を埋め込む
var gw_ka = new OpenLayers.Layer.KaMap("Global Weather",
"http://localhost/ka-map/tile.php", {g: "countries", map: "weather"});
/* ka-Mapの地図を埋め込みます。
*()の中は、("このレイヤの名前","tile.phpの場所",{g:"マップファイルのGROUP名", map:"ka-Mapの地図名"});
*/
map.addLayer(gw_ka); //地図にレイヤを追加
map.addControl(new OpenLayers.Control.LayerSwitcher()); //地図右上にある＋、レイヤ切り替え
map.zoomToMaxExtent(); //
}
</script>
</head>
<body onload="init()">
<!-- init()関数の読み込み -->
<h1 id="title">KaMap Example</h1>
<div id="tags"></div>
<!-- 地図表示の場所 -->
<div id="map"></div>
<div id="docs"></div>
</body>
</html>
0 件のコメント:
コメントを投稿