cesium-plotting-symbol
基于cesiumn的标绘插件
支持图形
点类型
点
3D模型
线
2阶bezier曲线
3阶bezier曲线
N阶bezier曲线
bezier平滑线
圆弧线
折线
多边形
多边形
矩形
椭圆
圆形
其他
单箭头
贴图类 3. 红旗
安装
npm install cesium-plotting-symbol --save
引入：
import cps from 'cesium-plotting-symbol'
属性编辑窗
export default {
components: {
'prop-editor': cps.PropEditor // 在vue中注册cps.PropEditor
}
}
开始绘图
用户通过鼠标和键盘控制图形的绘制过程
let graph = cps.start(new cps.Point())
或
let graph = cps.start({obj: 'Point'})
直接绘图
根据传入的参数直接绘制图形到地图上
let graph = cps.draw({obj: 'Point', color: '#00f', pixelSize: 12, alpha: 0.8, ctls: [{lon: 110, lat: 45}]})
在经纬度(110, 45)绘制一个大小为12, 蓝色，透明度0.8的点。
获取标绘的控制点信息
graph是new cps.Point()的结果，用来持有图形对象，目前提供以下功能： graph.getCtlPositions() // 返回图形的所有控制点的坐标，
graph.getCtlPositions().map((po) => {
return cps.mapUtil.convertCartesian(po)
}))
删除，清除图形
cps.delete()
删除当前选中的图形
cps.deleteAll()
删除所有图形
let json = cps.save()
保存当前所有标绘到一个json对象列表
cps.load(json)
从json中获取标绘图形列表，并直接绘制在地图上
快捷键
查看模式
创建模式
选择模式
'ctrl+shift+d', 'shift+delete': 清除所有图形
编辑模式
'delete', 'ctrl+d': 删除当前正在编辑的图形
控制点编辑模式
一个栗子(VUE)：
import cps from 'cesium-plotting-symbol'
export default {
name: 'mapview',
data () {
return {
graphList: []
}
},
methods: {
drawPoint () {
this.$data.graphList.push(cps.start(new cps.Point()))
},
drawArea () {
this.$data.graphList.push(cps.start({obj: 'Polygon'}))
},
getCtlPositions () {
this.$data.graphList.map((graph) => {
let pos = graph.getCtlPositions()
if (pos.length === 1) {
console.log('point:', cps.mapUtil.convertCartesian(pos[0]))
} else {
console.log('area:', pos.map((po) => {
return cps.mapUtil.convertCartesian(po)
}))
}
})
}
}
Current Tags
0.0.46 ... latest (2 years ago)
33 Versions
0.0.46 ... 2 years ago
0.0.45 ... 2 years ago
0.0.44 ... 2 years ago
0.0.43 ... 2 years ago
0.0.42 ... 2 years ago
0.0.41 ... 2 years ago
0.0.40 ... 2 years ago
0.0.39 ... 2 years ago
0.0.38 ... 2 years ago
0.0.37 ... 2 years ago
0.0.36 ... 2 years ago
0.0.34 ... 2 years ago
0.0.33 ... 2 years ago
0.0.32 ... 2 years ago
0.0.31 ... 2 years ago
0.0.30 ... 2 years ago
0.0.29 ... 2 years ago
0.0.28 ... 2 years ago
0.0.26 ... 2 years ago
0.0.25 ... 2 years ago
0.0.24 ... 2 years ago
0.0.23 ... 2 years ago
0.0.22 ... 3 years ago
0.0.19 ... 3 years ago
0.0.11 ... 3 years ago
0.0.10 ... 3 years ago
0.0.9 ... 3 years ago
0.0.8 ... 3 years ago
0.0.7 ... 3 years ago
0.0.6 ... 3 years ago
0.0.3 ... 3 years ago
0.0.2 ... 3 years ago
0.0.1 ... 3 years ago
