How to use the mapbox-gl.Evented function in mapbox-gl

To help you get started, we’ve selected a few mapbox-gl examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github SuperMap / iClient-JavaScript / src / mapboxgl / core / MapExtend.js View on Github external
function moveLayer(layerID, beforeLayerID) {
        var layer = document.getElementById(layerID);
        // var beforeLayer;
        if (beforeLayerID) {
            var beforeLayer = document.getElementById(beforeLayerID);
            if (!beforeLayer) {
                mapboxgl.Evented.prototype.fire("error", {
                    error: new Error(`Layer with id "${beforeLayerID}" does not exist on this document.`)
                });
            }
        }
        if (layer && beforeLayer) {
            beforeLayer.parentNode.insertBefore(layer, beforeLayer);
        } else {
            //当没有传入beforeLayerID ,则默认将图层移动到最上面
            layer.parentNode.appendChild(layer);
        }
    }
github SuperMap / iClient-JavaScript / src / mapboxgl / overlay / theme / GeoFeatureThemeLayer.js View on Github external
addFeatures(features) {
        /**
         * @event mapboxgl.supermap.GeoFeatureThemeLayer#beforefeaturesadded
         * @description 要素添加之前触发。
         * @property {mapboxgl.supermap.ThemeFeature|SuperMap.ServerFeature} features - 被添加的要素。
         */
        mapboxgl.Evented.prototype.fire('beforefeaturesadded', {features: features});
        //转换 features 形式
        this.features = this.toiClientFeature(features);

        if (!this.isCustomSetMaxCacheCount) {
            this.maxCacheCount = this.features.length * 5;
        }
        //绘制专题要素
        if (this.renderer) {
            this.redrawThematicFeatures(this.map.getBounds());
        }
    }
github SuperMap / iClient-JavaScript / src / mapboxgl / overlay / ThreeLayer.js View on Github external
*    camera=threeLayer.getCamera();
 *    var light = new THREE.PointLight(0xffffff);
 *    camera.add(light);
 *    var material = new THREE.MeshPhongMaterial({color: 0xff0000});
 *    //根据坐标点转换成模型
 *    var mesh = this.toThreeMesh(feature.geometry.coordinates, 10, material, true);
 *    //模型添加到3D场景
 *    scene.add(mesh);
 * }
 *
 * 叠加模型可以通过两种方式:<br>
 *     1.调用 threeLayer.toThreeMesh 直接将地理坐标转换成 threejs 3D 模型(适用于挤压模型,如城市建筑),然后添加到 3D 场景
 *     2.使用 ThreeJS 的接口创建好 Mesh,然后调用 threeLayer.setPosition 设置地理位置,然后添加到 3D 场景
 *
 */
export class ThreeLayer extends mapboxgl.Evented {

    //options.threeOptions是初始化threejs renderer的参数对象
    constructor(id, renderer, options) {
        super();
        this._layerId = id;
        this.options = options;
        let threeOptions = options &amp;&amp; options.threeOptions;
        this.renderer = new ThreeLayerRenderer(this, renderer, threeOptions);
    }

    /**
     * @function mapboxgl.supermap.ThreeLayer.prototype.toThreeShape
     * @description  创建 threejs shape 对象。
     * @param {Array} coordinates - 坐标点数组。
     * @returns THREE.Shape{@link https://threejs.org/docs/index.html#api/extras/core/Shape} threejs shape 对象。
     */
github SuperMap / iClient-JavaScript / src / mapboxgl / mapping / WebMap.js View on Github external
* @param {number} id - iPortal|Online 地图 ID。
 * @param {Object} options - 参数。
 * @param {string} [options.target='map'] - 地图容器 ID。
 * @param {string} [options.server="https://www.supermapol.com"] - 地图的地址。
 * @param {string} [options.credentialKey] - 凭证密钥。
 * @param {string} [options.credentialValue] - 凭证值。
 * @param {boolean} [options.withCredentials=false] - 请求是否携带 cookie。
 * @param {boolean} [options.excludePortalProxyUrl] - server 传递过来的 URL 是否带有代理。
 * @fires mapboxgl.supermap.WebMap#getmapfailed
 * @fires mapboxgl.supermap.WebMap#getwmtsfailed
 * @fires mapboxgl.supermap.WebMap#getlayersfailed
 * @fires mapboxgl.supermap.WebMap#getfeaturesfailed
 * @fires mapboxgl.supermap.WebMap#addlayerssucceeded
 * @extends {mapboxgl.Evented}
 */
export class WebMap extends mapboxgl.Evented {
	/**
	 * @constructs
	 * @version 9.1.2
	 */
	constructor(id, options) {
		super();
		this.mapId = id;
		options = options || {};
		this.server = options.server || 'https://www.supermapol.com';
		this.credentialKey = options.credentialKey;
		this.credentialValue = options.credentialValue;
		this.withCredentials = options.withCredentials || false;
		this.target = options.target || 'map';
		this._createWebMap();
	}
	/**
github SuperMap / iClient-JavaScript / src / mapboxgl / overlay / HeatMapLayer.js View on Github external
* @param {Object} options - 构造参数。
 * @param {mapboxgl.Map} options.map - mapboxgl map 对象。
 * @param {string} options.featureWeight - 对应 feature 属性中的热点权重字段名称,权重值类型为 float。
 * @param {string} [options.id] - 专题图层ID。默认使用 CommonUtil.createUniqueID("HeatMapLayer_") 创建专题图层 ID。
 * @param {number} [options.radius=50] - 热点渲染的最大半径(热点像素半径),单位为 px,当 useGeoUnit参数 为 true 时,单位使用当前图层地理坐标单位。热点显示的时候以精确点为中心点开始往四周辐射衰减,其衰减半径和权重值成比列。
 * @param {boolean} [options.loadWhileAnimating=true] - 是否实时重绘。(当绘制大数据量要素的情况下会出现卡顿,建议把该参数设为false)。
 * @param {number} [options.opacity=1] - 图层透明度。
 * @param {Array.} [options.colors=['blue','cyan','lime','yellow','red']] - 颜色线性渐变数组,颜色值必须为canvas所支。
 * @param {boolean} [options.useGeoUnit=false] - 使用地理单位,即默认热点半径默认使用像素单位。 当设置为 true 时,热点半径和图层地理坐标保持一致。
 * @extends {mapboxgl.Evented}
 * @fires mapboxgl.supermap.HeatMapLayer#featuresadded
 * @fires mapboxgl.supermap.HeatMapLayer#changelayer
 * @fires mapboxgl.supermap.HeatMapLayer#featuresremoved
 *
 */
export class HeatMapLayer extends mapboxgl.Evented {

    constructor(name, options) {
        super();

        var _options = options ? options : {};
        /**
         * @member {string} mapboxgl.supermap.HeatMapLayer.prototype.name
         * @description 图层名字。
         */
        this.name = name;

        /**
         * @member {string} mapboxgl.supermap.HeatMapLayer.prototype.id
         * @description 热力图图层 id。
         */
        this.id = _options.id ? _options.id : CommonUtil.createUniqueID("HeatMapLayer_");
github SuperMap / iClient-JavaScript / src / mapboxgl / services / ServiceBase.js View on Github external
import '../core/Base';

/**
 * @class mapboxgl.supermap.ServiceBase
 * @category  iServer
 * @description mapboxgl.supermap 服务基类。
 * @param {string} url - 与客户端交互的服务地址。 
 * @param {Object} options - 可选参数。
 * @param {string} [options.proxy] - 服务代理地址。
 * @param {SuperMap.ServerType} [options.serverType=SuperMap.ServerType.ISERVER] - 服务来源 iServer|iPortal|online。
 * @param {boolean} [options.withCredentials=false] - 请求是否携带 cookie。
 * @param {boolean} [options.crossOrigin] - 是否允许跨域请求。
 * @param {Object} [options.headers] - 请求头。
 * @fires mapboxgl.supermap.ServiceBase#initialized
 */
export class ServiceBase extends mapboxgl.Evented {

    constructor(url, options) {
        super();
        this.options = options || {};
        this.url = url;
        /**
         * @event mapboxgl.supermap.ServiceBase#initialized
         * @description 构造函数构造成功之后触发。
         * @property {Object} this - this 对象。
         */
        this.fire('initialized', this);
    }
}

mapboxgl.supermap.ServiceBase = ServiceBase;
github SuperMap / iClient-JavaScript / src / mapboxgl / overlay / theme / ThemeLayer.js View on Github external
removeAllFeatures() {
        if (this.renderer) {
            this.renderer.clear();
        }
        this.features = [];
        mapboxgl.Evented.prototype.fire('featuresremoved', {features: [], succeed: true});
    }
github SuperMap / iClient-JavaScript / src / mapboxgl / overlay / GraphThemeLayer.js View on Github external
addFeatures(features) {
        /**
         * @event mapboxgl.supermap.GraphThemeLayer#beforefeaturesadded
         * @description 要素添加之前触发。
         * @property {SuperMap.ServerFeature} features - 要被添加的要素。
         */
        var ret = mapboxgl.Evented.prototype.fire('beforefeaturesadded', {
            features: features
        });
        if (ret === false) {
            return;
        }
        //转换 features 形式
        this.features = this.toiClientFeature(features);
        //绘制专题要素
        if (this.renderer) {
            this.redrawThematicFeatures(this.map.getBounds());
        }
    }