なお実装するレイヤー情報は、商用利用自由のものが望ましいです。
よろしくお願いいたします。
No.1
22
5
各レイヤーは、上にしたり下にしたり、表示のON/OFFを制御できます。これらは、レイヤーウィンドウ中の下部にあるアイコンで制御できます。ウィンドウ中の各レイヤーをクリックして選択した後、上向きの↑と下向きの↓で、レイヤーの改装を変更できます。また、目が表示されているアイコンをクリックすることで、そのレイヤーの表示のON/OFFを制御することが出来ます。そのほかに、レイヤーの有効/無効の制御、レイヤーの併合、レイヤーを削除することも出来ます。
No.2
49732154
100pt
http://workshops.opengeo.org/stack-intro/openlayers.html#a-multi-layer-map
ここのコードが参考になると思います。
サンプルコード、ほぼ、そのままですが、こんな感じで動作するのを確認しました。
<html> <script src='http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAl9RMqSzhPUXAfeBCXOussRTQDbvAygy0cfGJr8dEMAYKf3RWNBQqP9mjKIsqTfmAlz5LOJ3Xpy5s4w'></script> <script src="http://www.openlayers.org/api/OpenLayers.js"></script> <body> <div id="demoMap"></div> <script> var map; // Avoid pink error tiles OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3; OpenLayers.Util.onImageLoadErrorColor = "transparent"; function init(){ // Map is in mercator this time, so over-ride the default // options that assume lat/lon. var options = { projection: new OpenLayers.Projection("EPSG:900913"), displayProjection: new OpenLayers.Projection("EPSG:4326"), units: "m", numZoomLevels: 20, maxResolution: 156543.0339, maxExtent: new OpenLayers.Bounds(-20037508, -20037508, 20037508, 20037508.34) }; // Create the map object map = new OpenLayers.Map('demoMap', options); // create Google Maps layer var gmap = new OpenLayers.Layer.Google( "Google Streets", // the default {'sphericalMercator': true, numZoomLevels: 20} ); // create Google Satellite layer var gsat = new OpenLayers.Layer.Google( "Google Satellite", {type: G_SATELLITE_MAP, 'sphericalMercator': true, numZoomLevels: 20} ); // create WMS taxlots layer var wmslayer = new OpenLayers.Layer.WMS( "Medford Taxlots", "http://localhost:8080/geoserver/wms", {'layers': 'postgis:taxlot_ply', 'format':'image/png', 'transparent':'true'}, {'opacity': 1.0, 'isBaseLayer': false, 'visibility': true} ); map.addLayers([gsat, gmap, wmslayer]); // ★レイヤーの順序を変えてます！ map.addControl(new OpenLayers.Control.LayerSwitcher()); // Coordinate display at bottom of map map.addControl(new OpenLayers.Control.MousePosition()); // Zoom to Medford, Oregon var point = new OpenLayers.LonLat(-122.8764, 42.3263); // Need to convert zoom point to mercator too point.transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject()); map.setCenter(point, 17); } init(); </script> </body> </html>
初期表示で衛星写真が表示されるように、レイヤーの順番を変えてます。
Google Map API のキーは、適切なものに変えてください。
a-kuma3さんありがとうございます。
「なお実装するレイヤー情報は、商用利用自由のものが望ましいです。」は満たされていませんが、第一条件はクリアしてますね。
参考にさせて頂きます。
213
202
あ、すみませんOpenStreetMapなら父親が使っていたのでちゃんとそれを書いたのですが…
御免なさい私フォトショップ派です(^^;
ご迷惑おかけしました。
2011/11/04 19:12:06星花✝さんすみません。
てっきりBotがそれっぽい答えを検索して載せたのかと思ったので強い口調で答えてしまいましたが、何か凄い勘違いされているだけのようですね。
OpenStreetMapのOpenLayersを用いることで、自分のHTMLページ上に地図を載せることができます。
http://wiki.openstreetmap.org/wiki/JA:OpenLayers_Simple_Example
私はこの載せる地図を(商用利用自由な)衛星写真・航空写真にしたいと考えています。
その為にはどのようにコードを書けば良いのか悩んでいます。
ですので、アイコンで制御できると書いてくるのは、(HTMLにアイコンもへったくれもないですから)ちっとも「ちゃんとそれを書いた」事にはならないのです。
いかがでしょうか？
2011/11/05 01:57:35