186 lines
5.5 KiB
JavaScript
186 lines
5.5 KiB
JavaScript
|
/**
|
|||
|
* @name: index
|
|||
|
* @author: Administrator
|
|||
|
* @date: 2023-03-04 10:39
|
|||
|
* @description:index
|
|||
|
* @update: 2023-03-04 10:39
|
|||
|
*/
|
|||
|
import { getHost } from "../../../on";
|
|||
|
import Base from '../index'
|
|||
|
import Tools from '../../../Tools'
|
|||
|
|
|||
|
class GeoJson extends Base {
|
|||
|
/**
|
|||
|
* @constructor
|
|||
|
* @param sdk
|
|||
|
* @param options {object} 参数
|
|||
|
* @param options.id {string} id
|
|||
|
* @param options.url {string} geojson地址
|
|||
|
* @param [options.color=#ef0606] {string} 线条颜色
|
|||
|
* @param [options.width=1] {number} 线条宽度
|
|||
|
* @example new YJ.Obj.GeoJson(earth,{id:"123",url:""})
|
|||
|
* */
|
|||
|
constructor(sdk, options = {}) {
|
|||
|
super(sdk, options)
|
|||
|
|
|||
|
this.primitive = undefined
|
|||
|
this.positions = []
|
|||
|
|
|||
|
this.loading = true
|
|||
|
}
|
|||
|
|
|||
|
setDefaultValue() {
|
|||
|
super.setDefaultValue()
|
|||
|
this.options.host = this.options.host || getHost()
|
|||
|
let url = this.options.url
|
|||
|
if (this.options.host) {
|
|||
|
let o = new URL(this.options.url, this.options.host)
|
|||
|
url = o.href
|
|||
|
}
|
|||
|
|
|||
|
this.options.url = url
|
|||
|
this.options.color = this.options.color || 'rgb(239, 6, 6, 0.2)'
|
|||
|
this.options.width = this.options.width || 1
|
|||
|
}
|
|||
|
|
|||
|
get show() {
|
|||
|
if (this.primitive) return this.primitive.show
|
|||
|
return undefined
|
|||
|
}
|
|||
|
|
|||
|
set show(status) {
|
|||
|
if (this.primitive) {
|
|||
|
this.primitive.show = status
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
async on() {
|
|||
|
let rsp = await fetch(this.options.url)
|
|||
|
let json = await rsp.json()
|
|||
|
this.geojson = json
|
|||
|
return GeoJson.addDataToGlobe(this, json.features)
|
|||
|
}
|
|||
|
|
|||
|
/*geojosn暂时只用线的形式*/
|
|||
|
static addDataToGlobe(that, features) {
|
|||
|
const instancesList = []
|
|||
|
const instancesPolygon = []
|
|||
|
for (let i = 0; i < features.length; i++) {
|
|||
|
let color = Cesium.Color.fromRandom().withAlpha(0.2)
|
|||
|
if(features[i].geometry.type === 'LineString' || features[i].geometry.type === 'MultiLineString') {
|
|||
|
let coordinates = features[i].geometry.coordinates
|
|||
|
if(features[i].geometry.type === 'LineString') {
|
|||
|
coordinates = [features[i].geometry.coordinates]
|
|||
|
}
|
|||
|
for (let m = 0; m < coordinates.length; m++) {
|
|||
|
let item = coordinates[i]
|
|||
|
let positions = []
|
|||
|
item.forEach(c => {
|
|||
|
positions.push(c[0], c[1])
|
|||
|
})
|
|||
|
const polyline = new Cesium.GroundPolylineGeometry({
|
|||
|
positions: Cesium.Cartesian3.fromDegreesArray(positions),
|
|||
|
width: that.options.width //线宽
|
|||
|
})
|
|||
|
instancesList.push(
|
|||
|
new Cesium.GeometryInstance({
|
|||
|
geometry: polyline
|
|||
|
})
|
|||
|
)
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
if(features[i].geometry.type === 'Polygon' || features[i].geometry.type === 'MultiPolygon') {
|
|||
|
let coordinates = features[i].geometry.coordinates
|
|||
|
if(features[i].geometry.type === 'Polygon') {
|
|||
|
coordinates = [features[i].geometry.coordinates]
|
|||
|
}
|
|||
|
for (let m = 0; m < coordinates.length; m++) {
|
|||
|
let item = coordinates[m]
|
|||
|
item.forEach(p => {
|
|||
|
let positions = []
|
|||
|
p.forEach(c => {
|
|||
|
positions.push(c[0], c[1])
|
|||
|
})
|
|||
|
let polygon = new Cesium.PolygonGeometry({
|
|||
|
polygonHierarchy: new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(positions)),
|
|||
|
});
|
|||
|
instancesPolygon.push(
|
|||
|
new Cesium.GeometryInstance({
|
|||
|
geometry: polygon,
|
|||
|
attributes: {
|
|||
|
color: Cesium.ColorGeometryInstanceAttribute.fromColor(
|
|||
|
Cesium.Color.fromRandom().withAlpha(0.2)
|
|||
|
),
|
|||
|
show: new Cesium.ShowGeometryInstanceAttribute(that.options.show ?? true), //显示或者隐藏
|
|||
|
},
|
|||
|
})
|
|||
|
)
|
|||
|
|
|||
|
const polyline = new Cesium.GroundPolylineGeometry({
|
|||
|
positions: Cesium.Cartesian3.fromDegreesArray(positions),
|
|||
|
width: 2
|
|||
|
})
|
|||
|
instancesList.push(
|
|||
|
new Cesium.GeometryInstance({
|
|||
|
geometry: polyline
|
|||
|
})
|
|||
|
)
|
|||
|
})
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
if (instancesList.length > 0) {
|
|||
|
that.primitive = new Cesium.GroundPolylinePrimitive({
|
|||
|
geometryInstances: instancesList,
|
|||
|
appearance: new Cesium.PolylineMaterialAppearance({
|
|||
|
material: Cesium.Material.fromType('Color', {
|
|||
|
color: Cesium.Color.fromCssColorString(that.options.color)
|
|||
|
})
|
|||
|
}),
|
|||
|
asynchronous: false, // 确定基元是异步创建还是阻塞直到准备就绪
|
|||
|
show: that.options.show ?? true
|
|||
|
})
|
|||
|
that.viewer.scene.primitives.add(that.primitive)
|
|||
|
}
|
|||
|
if (instancesPolygon.length > 0) {
|
|||
|
that.primitive = new Cesium.GroundPrimitive({
|
|||
|
geometryInstances: instancesPolygon,
|
|||
|
appearance: new Cesium.PerInstanceColorAppearance({
|
|||
|
translucent: true, //false时透明度无效
|
|||
|
closed: false,
|
|||
|
}),
|
|||
|
asynchronous: false, // 确定基元是异步创建还是阻塞直到准备就绪
|
|||
|
show: that.options.show ?? true
|
|||
|
})
|
|||
|
that.viewer.scene.primitives.add(that.primitive)
|
|||
|
}
|
|||
|
|
|||
|
that.loading = false
|
|||
|
}
|
|||
|
|
|||
|
remove() {
|
|||
|
if (this.primitive) {
|
|||
|
super.remove()
|
|||
|
this.viewer.scene.primitives.remove(this.primitive)
|
|||
|
this.primitive = null
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
flyTo() {
|
|||
|
if (!this.loading) {
|
|||
|
if(this.geojson) {
|
|||
|
let range = turf.bbox(this.geojson);
|
|||
|
this.viewer.camera.flyTo({
|
|||
|
destination: Cesium.Rectangle.fromDegrees(...range)
|
|||
|
});
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
flicker() { }
|
|||
|
}
|
|||
|
|
|||
|
export default GeoJson
|