arcgis api for javascript (2) 獲取屬性字段及自定義graphic樣式

通過FeatureLayer我們可以拿到一組graphic，graphic有attributes、geometry和symbol三個重要屬性，效果如下

這里並沒有用到真正的查詢功能，只是簡單的控制featureLayer的開閉。

主要步驟：

1.創建map，加載底圖

2.加載FeatureLayer，設置其symbol，初始visible不可見

3.點擊圖標則打開對應的featureLayer，關閉其他featureLayer，更新左側列表內容

 

第一步在上一篇講過，這里從第二步開始。注：這里代碼主要作為一個參考，並不能直接粘貼運行。

var FEATURELAYER_PREFIX = 'fl';

dojo.connect(map, 'onLoad', function (map) {
    $.get(SHANDONG_SERVER, { f: 'json' }, loadFeatureLayer, 'jsonp');
});
map.addLayer(baseLayer);

function loadFeatureLayer(data) {
    var 
        //該地圖里包含的圖層
        layers = data.layers,
        fLayers = [], fLayer,

        symbolNormal = new PictureMarkerSymbol("img/poi.png", 26, 30),
        renderer = new SimpleRenderer(symbolNormal);

    _.each(layers, function (layer) {
        //FeatureLayer的url即普通地圖服務地址加上圖層編號
        fLayer = new FeatureLayer(SHANDONG_SERVER + '/' + layer.id, {
            //服務返回graphic的模式，默認的就是這個MODE_ONDEMAND
            //根據map當前的extent返回數據，即只顯示你正在瀏覽的區域里的數據
            //但是我自己碰到一個問題，總是有一部分超出map當前extent的數據也返回了，即左側列表個數總是大於地圖上顯示的個數
            //雖然用代碼可以解決，但是至今沒找到原因，請高手指點！
            mode: FeatureLayer.MODE_ONDEMAND,
            extent: map.extent,
            //我們要在點擊圖標時才顯示對應featurelayer，所以一開始不顯示
            visible: false,
            //暴露所有字段
            outFields: ['*'],
            //指定該featurelayer的id
            id: FEATURELAYER_PREFIX + layer.id
        });
        //只有當地圖放大到一定級別以上才可見
        fLayer.setMinScale(550000);
        //給featurelayer設置樣式
        fLayer.setRenderer(renderer);
        fLayers.push(fLayer);
    });
    map.addLayers(fLayers);
}

//顯示該id的圖層
function showLayer(id) {
    var layer = map.getLayer(FEATURELAYER_PREFIX + id),
        graphics;
    //注意graphics是異步加載到map上的，所以得放在加載完成的回調里
    dojo.connect(layer, "onUpdateEnd", function (err) {
        if (err) return;
        // FeatureLayer.MODE_ONDEMAND模式下拿到的graphics有的超出map.extent, 原因不明
        // 手動判斷
        graphics = [];
        _.each(layer.graphics, function (graphic, index) {
            if (withinExtent(graphic)) {
                graphic.index = index;
                graphics.push(graphic);
            }
        });
        app.controller.buildQueryList(graphics);
    });
    //顯示圖層
    layer.show();
}

function withinExtent(graphic) {
    var x = graphic.geometry.x,
        y = graphic.geometry.y,
        extent = map.extent;
    if (x >= extent.xmin && x <= extent.xmax && y >= extent.ymin && y <= extent.ymax)
        return true;
    return false;
}

希望對大家有幫助，關於FeatureLayer.MODE_ONDEMAND的問題望大神解答~