地図のスタイルを変更する

【使い方】

「図式」プルダウンメニューを選択すると、地図のデザインが変更されます。
「Styleの設定」エリアで、各パラメーターをfalseに書き換えて「設定」ボタンを押すと、
指定したパラメーターの対象オブジェクトが地図上で非表示になります。trueに書き換えると再表示されます。
各パラメーターの対象オブジェクトについては、こちらを参照してください。

▼ 図式

▼ Styleの設定



ソースコード

var map;            //地図オブジェクト
var stylemaplayer;  //スタイル地図レイヤー
var layerset;       //レイヤーセット
/**
 * window.onloadイベントにて地図の読込処理を行います。
 */
window.onload = function() {
    map = new Y.Map("map",{"configure":{"scrollWheelZoom":true}});
    map.addControl(new Y.LayerSetControl());
    map.addControl(new Y.SliderZoomControlHorizontal());
    map.addControl(new Y.CenterMarkControl());

    //スタイル地図レイヤーを生成します。
    stylemaplayer = new Y.StyleMapLayer("simple");
    setStyle();
    //レイヤーセットを作成します。
    layerset = new Y.LayerSet("スタイル地図", [stylemaplayer]);
    //Mapオブジェクトにレイヤーセットを追加します。
    map.addLayerSet("stylemap",layerset);
    //標準地図レイヤーをレイヤーセットから削除します。
    map.removeLayerSet(Y.LayerSetId.NORMAL);
    //地図を描画します。
    map.drawMap(new Y.LatLng(35.680840,139.767009), 15 , "stylemap");
}
/**
 * スタイルを設定します。
 */
function setStyle() {
    var param = document.getElementById("style_onoff").value;
    if(param.indexOf(";") != -1) param="";
    if(param.indexOf("(") != -1) param="";
    if(param.indexOf(")") != -1) param="";
    var style = "";
    if(param != "") style = eval(param);
    //スタイルを設定します。
    stylemaplayer.setStyle(style);
}
/**
 * 図式を設定します。
 */
function setBase(selbox) {
    var idx = selbox.selectedIndex;
    var basename = selbox.options[idx].value;
    
    if (basename == "hybridPhoto") {
        //航空写真のハイブリッド表現を有効にします。
        map.setConfigure("hybridPhoto",true);
        //レイヤーセットを航空写真に切り替えます。
        if (map.getCurrentLayerSetId() != Y.LayerSetId.PHOTO) {
            map.setLayerSet(Y.LayerSetId.PHOTO);
        }
    } else {
        //航空写真のハイブリッド表現を無効にします。
        map.setConfigure("hybridPhoto",false);
        //レイヤーセットからスタイル地図レイヤーを削除します。
        layerset.removeLayer(stylemaplayer);
        //選択された図式名で新しくスタイル地図レイヤーを作成します。
        stylemaplayer = new Y.StyleMapLayer(basename);
        //作成したスタイル地図レイヤーをレイヤーセットに追加します。
        layerset.addLayer(stylemaplayer);
        //地図を再描画します。
        map.redraw(true);
        //レイヤーセットをスタイル地図に切り替えます。
        if (map.getCurrentLayerSetId() != "stylemap") {
            map.setLayerSet("stylemap");
        }
    }
    setStyle();
}
Webサービス by Yahoo! JAPAN