openlayers不常用接口介绍

openlayers不常用接口介绍

renderSync()
// Requests an immediate render in a synchronous manner.
// 同步方式请求一个立即渲染

ol.map.renderSync();
on(type, listener)
// Listen for a certain type of event.
// 监听特定类型的事件。
// 参数:
// type:string | Array.<string>	
// The event type or array of event types.
// 事件类型的时间类型或数组
// listener:function	
// The listener function.
// 监听函数

ol.map.on('pointermove', pointerMoveHandler);

ol/MapBrowserEvent~MapBrowserEvent
在这里插入图片描述

un(type, listener) 
Unlisten for a certain type of event.
// 不监听一个特定类型事件

ol/interaction/DragBox.DragBoxEvent

drawTool = new ol.interaction.Draw({
	source: source,
    type: geotype,
    style: new ol.style.Style({
        fill: new ol.style.Fill({
            color: 'rgba(255, 255, 255, 0.2)'
        }),
        stroke: new ol.style.Stroke({
            color: 'orange',
            lineDash: [10, 10],
            width: 2
        }),
        image: new ol.style.Circle({
            radius: 5,
            stroke: new ol.style.Stroke({
                color: 'rgba(0, 0, 0, 0.7)'
            }),
            fill: new ol.style.Fill({
                color: 'rgba(255, 255, 255, 0.2)'
            })
        })
    })
});

drawTool = new ol.interaction.DragBox({
   source: source,
   style: new ol.style.Style({
       fill: new ol.style.Fill({
           color: 'rgba(255, 255, 255, 0.5)'
       }),
       stroke: new ol.style.Stroke({
           color: 'orange',
           lineDash: [10, 10],
           width: 2
       }),
       image: new ol.style.Circle({
           radius: 5,
           stroke: new ol.style.Stroke({
               color: 'rgba(0, 0, 0, 0.7)'
           }),
           fill: new ol.style.Fill({
               color: 'rgba(255, 255, 255, 0.2)'
           })
       })
   })
});

drawTool.on('boxstart', function (e) {
});
ol.map.addInteraction(drawTool);

在这里插入图片描述
ol/interaction/Draw.DrawEvent
在这里插入图片描述

var source=ol.map.drawLayer.getSource();
infoDiv = options.infoDiv;
toolElement.title = options.controlText;
toolElement.className=options.className;

toolElement.removeEventListener('click',handleMeasure);
toolElement.addEventListener('click', handleMeasure, false);
// addEventListener() 方法用于向指定元素添加监听事件。且同一元素目标可重复添加,不会覆盖之前相同事件,配合 removeEventListener() 方法来移除事件。
// 参数说明:有三个参数
// 参数1、事件名称,字符串,必填。
// 事件名称不用带 "on" 前缀,点击事件直接写:"click",键盘放开事件写:"keyup"

// 参数2、执行函数,必填。
// 填写需要执行的函数,如:function(){代码...} 
// 当目标对象事件触发时,会传入一个事件参数,参数名称可自定义,如填写event,不需要也可不填写。 事件对象的类型取决于特定的事件。
// 例如, “click” 事件属于 MouseEvent(鼠标事件) 对象。
// function(event){console.log(event)}

// 参数3、触发类型,布尔型,可空 
// true - 事件在捕获阶段执行
// false - 事件在冒泡阶段执行,默认是false

ol/Observable

import {unByKey} from 'ol/Observable';
// Removes an event listener using the key returned by on() or once().
// 使用键移除事件监听 用on()或once()返回

// 移除地图要素点击事件
SSMap.prototype.removeFeatureClick=function(){
    this.olMap.unByKey(this.popupclickkey);
    this.olMap.unByKey(this.pointermoveKey);
    this.container.style.cursor='crosshair';
};
// 格式化距离
var formatLength = function (line,cir) {
    var length;
    if (geodesicmeasures) {
        var coordinates = line.getCoordinates();
        length = 0;
        var sourceProj = 'EPSG:900913';
        for (var i = 0, ii = coordinates.length - 1; i < ii; ++i) {
            var c1 = ol.proj.transform(coordinates[i], sourceProj, 'EPSG:4326');
            var c2 = ol.proj.transform(coordinates[i + 1], sourceProj,'EPSG:4326');
            length += wgs84Sphere.haversineDistance(c1, c2);
//            if(cir&&coordinates.length>2&&(i+1== coordinates.length - 1)){
//                var c1 = ol.proj.transform(coordinates[i+1], sourceProj, 'EPSG:4326');
//                var c2 = ol.proj.transform(coordinates[0], sourceProj,'EPSG:4326');
//                length += wgs84Sphere.haversineDistance(c1, c2);
//            }
        }
    } else {
        length = Math.round(line.getLength() * 100) / 100;
    }
    var output;
    if (length > 1000) {
        output = '距离:'+(Math.round(length / 1000 * 100) / 100) + ' ' + 'km';
    } else {
        output = '距离:'+(Math.round(length * 100) / 100) + ' ' + 'm';
    }
    return output;
};

 // 格式化面积
var formatArea = function (polygon) {
    var area;
    if (geodesicmeasures) {
        var sourceProj = 'EPSG:900913';
        var geom = /** @type {ol.geom.Polygon} */
            (polygon.clone().transform(sourceProj, 'EPSG:4326'));
        var coordinates = geom.getLinearRing(0).getCoordinates();
        area = Math.abs(wgs84Sphere.geodesicArea(coordinates));
    } else {
        area = polygon.getArea();
    }
    var output;
    if (area > 10000) {
        output ='面积:'+ (Math.round(area / 1000000 * 100) / 100) + ' '
        + 'km<sup>2</sup>';
    } else {
        output ='面积:'+ (Math.round(area * 100) / 100) + ' ' + 'm<sup>2</sup>';
    }

    var  line=new ol.geom.LineString( polygon.getCoordinates()[0]);
    var lineout=formatLength(line,true);
    return lineout+';'+output;
};
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Jennifer33K

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值