openlayers鼠标移动获取地图经纬度格式化的两种方式

方式一

import { format } from 'ol/coordinate';
import MousePosition from "ol/control/MousePosition.js";
//鼠标获取坐标控件
const mousePositionControl = new MousePosition({
    coordinateFormat: function (coordinate) {
        return format(coordinate, '经度:{x} 纬度:{y}', 2);
    },
    projection: 'EPSG:4326',
    className: 'custom-mouse-position',
    target: document.getElementById('mouse-position'),
    undefinedHTML: ' '
});
//添加控件到地图
map.addControl(mousePositionControl);

格式像这样:经度:165.23 纬度:13.71

方式二

import { createStringXY } from 'ol/coordinate.js';
import MousePosition from "ol/control/MousePosition.js";
//鼠标获取坐标
const mousePositionControl = new MousePosition({
    coordinateFormat: createStringXY(2),
    projection: 'EPSG:4326',
    className: 'custom-mouse-position',
    target: document.getElementById('mouse-position'),
    undefinedHTML: ' '
});
map.addControl(mousePositionControl);

格式像这样:165.23 13.71

评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值