• openlayers 3方法继承


       之前Web GIS开发使用的ArcGIS API用起来很系统,但是使用开源Web GIS API已经成主流趋势(你懂的~),最近项目想要从ArcGIS API 转到openlayers API,用起来不是那么的得心应手。举个例子:ArcGIS API可以通过Map.getLayer(layerid)方法根据图层的id得到想要的图层,比较方便也便于后期图层管理,绘图也可以临时添加、删除图层来提高内部效率,而不是将Verctor绘图图层存储为全局变量。

       以ol.layer.Vector为例,打开http://openlayers.org/en/latest/apidoc/ol.layer.Base.html:

    1.找到ol.layer.Vector

      可以看到ol.layer.Vector是从ol.layer.Layer继承,继而打开ol.layer.Layer,同样的步骤ol.layer.Layer是从ol.layer.Base继承。

    2.打开ol-debug.js文件,搜索“ol.layer.Base”:

     1 ol.layer.Base = function (options) {
     2
     3         ol.Object.call(this);
     4
     5         /**
     6          * @type {Object.<string, *>}
     7          */
     8         var properties = ol.obj.assign({}, options);
     9         properties[ol.layer.Property.OPACITY] =
    10             options.opacity !== undefined ? options.opacity : 1;
    11         properties[ol.layer.Property.VISIBLE] =
    12             options.visible !== undefined ? options.visible : true;
    13         properties[ol.layer.Property.Z_INDEX] =
    14             options.zIndex !== undefined ? options.zIndex : 0;
    15         properties[ol.layer.Property.MAX_RESOLUTION] =
    16             options.maxResolution !== undefined ? options.maxResolution : Infinity;
    17         properties[ol.layer.Property.MIN_RESOLUTION] =
    18             options.minResolution !== undefined ? options.minResolution : 0;
    19         properties[ol.layer.Property.ID] =
    20             options.id !== undefined ? options.id : "";
    21         this.setProperties(properties);
    22
    23         /**
    24          * @type {ol.LayerState}
    25          * @private
    26          */
    27         this.state_ = /** @type {ol.LayerState} */ ({
    28             layer: /** @type {ol.layer.Layer} */ (this),
    29             managed: true
    30         });
    31
    32     };

    可以看到图层的基础属性全部在 ol.layer.Property变量中

    ol.layer.Property = {
            OPACITY: 'opacity',
            VISIBLE: 'visible',
            EXTENT: 'extent',
            Z_INDEX: 'zIndex',
            MAX_RESOLUTION: 'maxResolution',
            MIN_RESOLUTION: 'minResolution',
            SOURCE: 'source',
            ID: "id"
        };

    3.Property变量中添加ID:"id",图层基类中添加图层的ID属性,同时在 ol.layer.Base方法中添加:

    properties[ol.layer.Property.ID] =
     options.id !== undefined ? ptions.id : "";

    4.图层中添加图层:

    var map = this.getMap();
        var source = new ol.source.Vector();
    
        var vector = new ol.layer.Vector({
            id: "draw-layer",
            source: source
        });
    
        map.addLayer(vector);

    5.查看图层属性

      打开开发者模式(F12),在 map.addLayer(vector);这一行添加断点

     测试发现,所有从ol.layer.Base继承的图层都存在id这个属性。继而搜索ol.Map,添加你想要的方法,例如这边我可能需要添加验证Map是否包含某个图层和获取图层的方法

    /**
         * Gets a given layer of this map by layerid.
         * {@link ol.Collection}.
         * @param {ol.layer.Base} layer Layer.
         * @api
         */
        ol.Map.prototype.getLayer = function (layerID) {
    
        };
    
        /**
         * check if Map contains a Layer by LayerID
         * @param string layerID
         * */
        ol.Map.prototype.contains = function (layerID) {
            var layers = this.getLayerGroup().getLayers();
        };
  • 相关阅读:
    第四章 高级查询(二)
    部分 语法Mysql
    MySQL高级查询
    BZOJ 3124 SDOI2013 直径
    BZOJ 3130 SDOI2013 费用流
    BZOJ 3993 SDOI2015 星际战争
    BZOJ 3997 TJOI2015 组合数学
    BZOJ 4003 JLOI2015 城池攻占
    BZOJ 3925 ZJOI2015 地震后的幻想乡
    codeforces #313 div1 E
  • 原文地址:https://www.cnblogs.com/zfygiser/p/8257791.html
Copyright © 2020-2023  润新知