518 lines
21 KiB
JavaScript
518 lines
21 KiB
JavaScript
|
const viewUtil = {
|
|||
|
|
/**
|
|||
|
|
* 添加发光墙体
|
|||
|
|
* @param {*} source
|
|||
|
|
* @param {*} feature
|
|||
|
|
* @param {*} minimumHeight
|
|||
|
|
* @param {*} maximumHeight
|
|||
|
|
*/
|
|||
|
|
addWallByFeature(source,feature,colorStr,minimumHeight,maximumHeight){
|
|||
|
|
let coords = feature.geometry.coordinates[0][0];
|
|||
|
|
minimumHeight = minimumHeight?Number(minimumHeight):100,
|
|||
|
|
maximumHeight = maximumHeight?Number(maximumHeight):5000
|
|||
|
|
colorStr = colorStr?colorStr:"rgb(255,255,0)"
|
|||
|
|
source.entities.add({
|
|||
|
|
// name: "发光动态墙体",
|
|||
|
|
wall: {
|
|||
|
|
positions: Cesium.Cartesian3.fromDegreesArray(coords.flat(2)),
|
|||
|
|
material: new WallDiffuseMaterialProperty({
|
|||
|
|
color: Cesium.Color.fromCssColorString(colorStr).withAlpha(0.7),
|
|||
|
|
duration: 3000,
|
|||
|
|
}),
|
|||
|
|
minimumHeights: Array(coords.length).fill(minimumHeight),
|
|||
|
|
maximumHeights: Array(coords.length).fill(maximumHeight),
|
|||
|
|
outline: false,
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
/**
|
|||
|
|
* 创建轮廓线，使用Entity实现
|
|||
|
|
* @param {*} source 数据源
|
|||
|
|
* @param {*} geometry 要素的几何对象
|
|||
|
|
* @param {*} colorStr 填充颜色
|
|||
|
|
* @param {*} outlineColorStr 轮廓线颜色
|
|||
|
|
* @param {*} outlineWidth 轮廓线宽度
|
|||
|
|
* @param {*} isFill 是否填充
|
|||
|
|
*/
|
|||
|
|
createOutlinePolygon(source,feature,colorStr,outlineColorStr,outlineWidth,isFill=true){
|
|||
|
|
let geometryType = feature.geometry.type;
|
|||
|
|
let coords = feature.geometry.coordinates;
|
|||
|
|
let attr = feature.properties;
|
|||
|
|
// console.log(attr.name)
|
|||
|
|
if(geometryType == "MultiPolygon"){
|
|||
|
|
coords.forEach((polygon,i)=>{
|
|||
|
|
let polygonHierarchy = null;
|
|||
|
|
if(polygon.length>1){
|
|||
|
|
let holesArr = [],rings = polygon.slice(1,polygon.length);
|
|||
|
|
rings.forEach(cd=>{
|
|||
|
|
holesArr.push(new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(cd.flat(2))))
|
|||
|
|
})
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)),holesArr)
|
|||
|
|
}else{
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)))
|
|||
|
|
}
|
|||
|
|
console.log(attr.name)
|
|||
|
|
let entity = source.entities.add({
|
|||
|
|
id:JSON.stringify({...attr,index:i}),//多环的时候单纯用attr会ID重复，所以使用环的索引加以区分。
|
|||
|
|
polygon: {
|
|||
|
|
hierarchy: polygonHierarchy,
|
|||
|
|
material: Cesium.Color.fromCssColorString(colorStr?colorStr:"red"),
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
entity.polygon.fill = isFill;
|
|||
|
|
entity.polygon.outlineWidth = outlineWidth;
|
|||
|
|
entity.polygon.outline = false;
|
|||
|
|
entity.polygon.outlineColor = Cesium.Color.RED;
|
|||
|
|
entity.polyline = {
|
|||
|
|
positions: entity.polygon.hierarchy._value.positions,
|
|||
|
|
width: entity.polygon.outlineWidth,
|
|||
|
|
material: Cesium.Color.fromCssColorString(outlineColorStr?outlineColorStr:"red"),
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 添加面要素
|
|||
|
|
* @param {*} source 数据源
|
|||
|
|
* @param {*} feature 要素
|
|||
|
|
* @param {*} colorStr 填充颜色
|
|||
|
|
*/
|
|||
|
|
addPolygonEntityByFeature(source,feature,colorStr){
|
|||
|
|
let geometryType = feature.geometry.type;
|
|||
|
|
let coord = feature.geometry.coordinates;
|
|||
|
|
if(geometryType == "MultiPolygon"){
|
|||
|
|
// let polygon = coord[0];
|
|||
|
|
// let outBoundary = new Cesium.PolygonHierarchy( Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)))
|
|||
|
|
// source.add(new Cesium.Primitive({
|
|||
|
|
// geometryInstances : new Cesium.GeometryInstance({
|
|||
|
|
// geometry: new Cesium.PolygonGeometry({
|
|||
|
|
// polygonHierarchy : outBoundary
|
|||
|
|
|
|||
|
|
// }),
|
|||
|
|
// id:id
|
|||
|
|
// }),
|
|||
|
|
// appearance : new Cesium.EllipsoidSurfaceAppearance({
|
|||
|
|
// material: new Cesium.Material({
|
|||
|
|
// fabric : {
|
|||
|
|
// type : 'Color',
|
|||
|
|
// uniforms : {
|
|||
|
|
// color : Cesium.Color.fromCssColorString(colorStr?colorStr:"red")
|
|||
|
|
// }
|
|||
|
|
// }
|
|||
|
|
// }),
|
|||
|
|
// faceForward : true
|
|||
|
|
// })
|
|||
|
|
// }));
|
|||
|
|
coord.forEach(polygon=>{
|
|||
|
|
let polygonHierarchy = null;
|
|||
|
|
if(polygon.length>1){
|
|||
|
|
let holesArr = [],rings = polygon.slice(1,polygon.length);
|
|||
|
|
rings.forEach(cd=>{
|
|||
|
|
holesArr.push(new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(cd.flat(2))))
|
|||
|
|
})
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)),holesArr)
|
|||
|
|
}else{
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)))
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
source.entities.add({
|
|||
|
|
polygon: {
|
|||
|
|
hierarchy: polygonHierarchy,
|
|||
|
|
material: Cesium.Color.fromCssColorString(colorStr?colorStr:"red"),
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
addPolygonPrimitiveByFeature(primitiveCollection,feature,colorStr){
|
|||
|
|
let geometryType = feature.geometry.type;
|
|||
|
|
let coord = feature.geometry.coordinates;
|
|||
|
|
if(geometryType == "MultiPolygon"){
|
|||
|
|
coord.forEach(polygon=>{
|
|||
|
|
let polygonHierarchy = null;
|
|||
|
|
if(polygon.length>1){
|
|||
|
|
let holesArr = [],rings = polygon.slice(1,polygon.length);
|
|||
|
|
rings.forEach(cd=>{
|
|||
|
|
holesArr.push(new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(cd.flat(2))))
|
|||
|
|
})
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)),holesArr)
|
|||
|
|
}else{
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)))
|
|||
|
|
}
|
|||
|
|
primitiveCollection.add(new Cesium.Primitive({
|
|||
|
|
geometryInstances : new Cesium.GeometryInstance({
|
|||
|
|
geometry: new Cesium.PolygonGeometry({
|
|||
|
|
polygonHierarchy : polygonHierarchy
|
|||
|
|
|
|||
|
|
}),
|
|||
|
|
id:JSON.stringify(feature.properties)
|
|||
|
|
}),
|
|||
|
|
appearance : new Cesium.EllipsoidSurfaceAppearance({
|
|||
|
|
material: new Cesium.Material({
|
|||
|
|
fabric : {
|
|||
|
|
type : 'Color',
|
|||
|
|
uniforms : {
|
|||
|
|
color : Cesium.Color.fromCssColorString(colorStr?colorStr:"red")
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}),
|
|||
|
|
faceForward : true
|
|||
|
|
})
|
|||
|
|
}));
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
addGeoVisImagerLayer(viewer,type){
|
|||
|
|
switch(type){
|
|||
|
|
case "yingxiang":{
|
|||
|
|
viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({
|
|||
|
|
url: "https://tiles{s}.geovisearth.com/base/v1/img/{z}/{x}/{y}?format=webp&tmsIds=w&token="+geovisearthConfig.token,
|
|||
|
|
subdomains:'123',
|
|||
|
|
tilingScheme: new Cesium.WebMercatorTilingScheme(),
|
|||
|
|
minimumLevel: 4,
|
|||
|
|
maximumLevel: 18,
|
|||
|
|
}))
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
case "shiliang":{
|
|||
|
|
viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({
|
|||
|
|
url: "https://tiles{s}.geovisearth.com/base/v1/vec/{z}/{x}/{y}?format=png&tmsIds=w&token="+geovisearthConfig.token,
|
|||
|
|
subdomains:'123',
|
|||
|
|
tilingScheme: new Cesium.WebMercatorTilingScheme(),
|
|||
|
|
minimumLevel: 4,
|
|||
|
|
maximumLevel: 18,
|
|||
|
|
}))
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
addWaterFeature(primitiveCollection,feature) {
|
|||
|
|
let geometryType = feature.geometry.type;
|
|||
|
|
let coord = feature.geometry.coordinates;
|
|||
|
|
let attr = feature.properties;
|
|||
|
|
|
|||
|
|
if (geometryType == "MultiPolygon") {
|
|||
|
|
coord.forEach((polygon) => {
|
|||
|
|
let polygonHierarchy = null;
|
|||
|
|
if(polygon.length>1){
|
|||
|
|
let holesArr = [],rings = polygon.slice(1,polygon.length);
|
|||
|
|
rings.forEach(cd=>{
|
|||
|
|
holesArr.push(new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(cd.flat(2))))
|
|||
|
|
})
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)),holesArr)
|
|||
|
|
}else{
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)))
|
|||
|
|
}
|
|||
|
|
primitiveCollection.add(
|
|||
|
|
new Cesium.GroundPrimitive({
|
|||
|
|
geometryInstances: new Cesium.GeometryInstance({
|
|||
|
|
geometry: new Cesium.PolygonGeometry({
|
|||
|
|
polygonHierarchy: polygonHierarchy,
|
|||
|
|
}),
|
|||
|
|
attributes: {
|
|||
|
|
// 通过attributes属性统一指定线段颜色
|
|||
|
|
color: Cesium.ColorGeometryInstanceAttribute.fromColor(
|
|||
|
|
new Cesium.Color(1.0, 0, 0, 1.0)
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
id: attr,
|
|||
|
|
}),
|
|||
|
|
appearance: new Cesium.EllipsoidSurfaceAppearance({
|
|||
|
|
material: new Cesium.Material({
|
|||
|
|
fabric: {
|
|||
|
|
type: "Water",
|
|||
|
|
uniforms: {
|
|||
|
|
// 水的基本颜色
|
|||
|
|
baseWaterColor: new Cesium.Color(
|
|||
|
|
64 / 255.0,
|
|||
|
|
157 / 255.0,
|
|||
|
|
253 / 255.0,
|
|||
|
|
0.5
|
|||
|
|
),
|
|||
|
|
// 水法向摄动的法线图
|
|||
|
|
normalMap:
|
|||
|
|
"./Build/Cesium/Assets/Textures/waterNormals.jpg",
|
|||
|
|
// 波纹数量
|
|||
|
|
frequency: 1000.0,
|
|||
|
|
// 动画速度
|
|||
|
|
animationSpeed: 0.002,
|
|||
|
|
// 振动的幅度
|
|||
|
|
amplitude: 150,
|
|||
|
|
// 镜面反射的强度
|
|||
|
|
specularIntensity: 1,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
}),
|
|||
|
|
faceForward: true,
|
|||
|
|
}),
|
|||
|
|
})
|
|||
|
|
);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
addWaterFeature1(primitiveCollection,feature) {
|
|||
|
|
let geometryType = feature.geometry.type;
|
|||
|
|
let coord = feature.geometry.coordinates;
|
|||
|
|
let attr = feature.properties;
|
|||
|
|
|
|||
|
|
if (geometryType == "MultiPolygon") {
|
|||
|
|
coord.forEach((polygon) => {
|
|||
|
|
let polygonHierarchy = null;
|
|||
|
|
if(polygon.length>1){
|
|||
|
|
let holesArr = [],rings = polygon.slice(1,polygon.length);
|
|||
|
|
rings.forEach(cd=>{
|
|||
|
|
holesArr.push(new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(cd.flat(2))))
|
|||
|
|
})
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)),holesArr)
|
|||
|
|
}else{
|
|||
|
|
polygonHierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)))
|
|||
|
|
}
|
|||
|
|
primitiveCollection.add(
|
|||
|
|
new Cesium.Primitive({
|
|||
|
|
geometryInstances: new Cesium.GeometryInstance({
|
|||
|
|
geometry: new Cesium.PolygonGeometry({
|
|||
|
|
polygonHierarchy: polygonHierarchy,
|
|||
|
|
}),
|
|||
|
|
attributes: {
|
|||
|
|
// 通过attributes属性统一指定线段颜色
|
|||
|
|
color: Cesium.ColorGeometryInstanceAttribute.fromColor(
|
|||
|
|
new Cesium.Color(1.0, 0, 0, 1.0)
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
id: attr,
|
|||
|
|
}),
|
|||
|
|
appearance: new Cesium.EllipsoidSurfaceAppearance({
|
|||
|
|
material: new Cesium.Material({
|
|||
|
|
fabric: {
|
|||
|
|
type: "Water",
|
|||
|
|
uniforms: {
|
|||
|
|
// 水的基本颜色
|
|||
|
|
baseWaterColor: new Cesium.Color(
|
|||
|
|
64 / 255.0,
|
|||
|
|
157 / 255.0,
|
|||
|
|
253 / 255.0,
|
|||
|
|
0.5
|
|||
|
|
),
|
|||
|
|
// 水法向摄动的法线图
|
|||
|
|
normalMap:
|
|||
|
|
"./Build/Cesium/Assets/Textures/waterNormals.jpg",
|
|||
|
|
// 波纹数量
|
|||
|
|
frequency: 1000.0,
|
|||
|
|
// 动画速度
|
|||
|
|
animationSpeed: 0.002,
|
|||
|
|
// 振动的幅度
|
|||
|
|
amplitude: 150,
|
|||
|
|
// 镜面反射的强度
|
|||
|
|
specularIntensity: 1,
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
}),
|
|||
|
|
faceForward: true,
|
|||
|
|
}),
|
|||
|
|
})
|
|||
|
|
);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
addEffect(type,result,color,visible){
|
|||
|
|
switch(type){
|
|||
|
|
case "polygon":{
|
|||
|
|
const primitives = new Cesium.PrimitiveCollection({ show:!!visible });
|
|||
|
|
result.features.forEach((feature) => {
|
|||
|
|
primitives.add(this.createPrimitiveByFeature1(feature, color));
|
|||
|
|
});
|
|||
|
|
viewer.scene.primitives.add(primitives);// 添加面
|
|||
|
|
return primitives;
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
case "label":{
|
|||
|
|
const labelCollection = new Cesium.LabelCollection({ show:!!visible });
|
|||
|
|
result.features.forEach((feature) => {
|
|||
|
|
labelCollection.add(this.addLabel(feature));
|
|||
|
|
});
|
|||
|
|
viewer.scene.primitives.add(labelCollection); // 添加 label
|
|||
|
|
return labelCollection;
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
case "water":{
|
|||
|
|
const waterPrimitives = new Cesium.PrimitiveCollection({ show:!!visible});
|
|||
|
|
result.features.forEach((feature) => {
|
|||
|
|
this.addWaterFeature(waterPrimitives,feature);
|
|||
|
|
});
|
|||
|
|
viewer.scene.primitives.add(waterPrimitives); // 添加 水面特效
|
|||
|
|
return waterPrimitives;
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
case "glow":{
|
|||
|
|
let tmpDataSource = new Cesium.CustomDataSource();
|
|||
|
|
viewer.dataSources.add(tmpDataSource);
|
|||
|
|
result.features.forEach((feature) => {
|
|||
|
|
tmpDataSource.entities.add(this.addGlowFeature(feature,!!visible,color))
|
|||
|
|
})
|
|||
|
|
tmpDataSource.show = !!visible;
|
|||
|
|
return tmpDataSource;
|
|||
|
|
}
|
|||
|
|
case "dynamicLine":{
|
|||
|
|
let dyDataSource = new Cesium.CustomDataSource();
|
|||
|
|
viewer.dataSources.add(dyDataSource);
|
|||
|
|
result.features.forEach((feature) => {
|
|||
|
|
dyDataSource.entities.add(this.addDynamicLine(feature,!!visible,color))
|
|||
|
|
})
|
|||
|
|
dyDataSource.show = !!visible;
|
|||
|
|
return dyDataSource;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
createPrimitiveByFeature1(feature, rgba) {
|
|||
|
|
let coords = feature.geometry.coordinates;
|
|||
|
|
let color = rgba?rgba:"#c7d221";
|
|||
|
|
let ground = new Cesium.GroundPrimitive({
|
|||
|
|
geometryInstances: new Cesium.GeometryInstance({
|
|||
|
|
geometry: new Cesium.PolygonGeometry({
|
|||
|
|
polygonHierarchy: coords[0][0][0].length==3?new Cesium.PolygonHierarchy(
|
|||
|
|
Cesium.Cartesian3.fromDegreesArrayHeights(coords.flat(3))
|
|||
|
|
):new Cesium.PolygonHierarchy(
|
|||
|
|
Cesium.Cartesian3.fromDegreesArray(coords.flat(3))
|
|||
|
|
),
|
|||
|
|
}),
|
|||
|
|
id: feature.properties,
|
|||
|
|
attributes: { color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.fromCssColorString(color)) },
|
|||
|
|
}),
|
|||
|
|
appearance : new Cesium.PerInstanceColorAppearance({
|
|||
|
|
translucent : false
|
|||
|
|
})
|
|||
|
|
});
|
|||
|
|
return ground;
|
|||
|
|
},
|
|||
|
|
addLabel(feature){
|
|||
|
|
// 计算中心点
|
|||
|
|
let polygon = feature.geometry.coordinates[0];
|
|||
|
|
let points = [];
|
|||
|
|
polygon.forEach(ring=>{
|
|||
|
|
ring.forEach(coord=>{
|
|||
|
|
points.push([coord[0],coord[1]]);
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
let pointss = turf.points(points);
|
|||
|
|
let centerResult = turf.center(pointss);
|
|||
|
|
let center = centerResult.geometry.coordinates
|
|||
|
|
return {
|
|||
|
|
position: Cesium.Cartesian3.fromDegrees(center[0],center[1],18),
|
|||
|
|
text: feature.properties["名称"]?feature.properties["名称"]:feature.properties["zldwmc"],
|
|||
|
|
font: "24px Helvetica",
|
|||
|
|
horizontalOrigin:Cesium.HorizontalOrigin.CENTER,// 水平对齐方式
|
|||
|
|
verticalOrigin:Cesium.HorizontalOrigin.CENTER,// 垂直对齐方式
|
|||
|
|
fillColor: Cesium.Color.WHITE,
|
|||
|
|
outlineColor: Cesium.Color.BLACK,
|
|||
|
|
outlineWidth: 1,
|
|||
|
|
showBackground:false,
|
|||
|
|
selectionIndicator:false,
|
|||
|
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
|||
|
|
scale:0.8,
|
|||
|
|
disableDepthTestDistance: 100.0,
|
|||
|
|
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10.0, 30000.0),//根据到相机的距离确定可见性。
|
|||
|
|
scaleByDistance: new Cesium.NearFarScalar(500, 1, 30000, 0.0),
|
|||
|
|
// translucencyByDistance: new Cesium.NearFarScalar(500, 1, 1400, 0.0)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
addGlowFeature(feature,show,colorStr){
|
|||
|
|
let geometryType = feature.geometry.type;
|
|||
|
|
let coord = feature.geometry.coordinates;
|
|||
|
|
if(geometryType == "MultiPolygon"){
|
|||
|
|
let polygon = coord[0];
|
|||
|
|
return {
|
|||
|
|
name: "具有发光效果的线",
|
|||
|
|
polyline: {
|
|||
|
|
positions: Cesium.Cartesian3.fromDegreesArray(polygon[0].flat(2)),// 只取外环，构造边界线
|
|||
|
|
width: 4,
|
|||
|
|
material: new Cesium.PolylineGlowMaterialProperty({
|
|||
|
|
glowPower: 0.2,
|
|||
|
|
color:Cesium.Color.fromCssColorString(colorStr?colorStr:"#242dc2"),
|
|||
|
|
}),
|
|||
|
|
followSurface: false, //是否贴着地表
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
/**
|
|||
|
|
* 返回线 PolylineGraphics
|
|||
|
|
* @param {*} feature 线要素
|
|||
|
|
* @param {*} color
|
|||
|
|
* @param {*} width
|
|||
|
|
* @returns
|
|||
|
|
*/
|
|||
|
|
addDynamicLine(feature,color,width=1){
|
|||
|
|
if(feature.geometry.type == "MultiLineString"){
|
|||
|
|
let coords = feature.geometry.coordinates[0];
|
|||
|
|
let name = feature.properties.name;
|
|||
|
|
let colorStr = color?color:"#FF0";
|
|||
|
|
if(name!=null&&name.includes("高速")){
|
|||
|
|
color = Cesium.Color.WHITE ;
|
|||
|
|
width = 3;
|
|||
|
|
}
|
|||
|
|
return {
|
|||
|
|
id:JSON.stringify(feature.properties),
|
|||
|
|
polyline: {
|
|||
|
|
positions: Cesium.Cartesian3.fromDegreesArray(coords.flat(2)),
|
|||
|
|
width: width,
|
|||
|
|
material: new PolylineTrailMaterial({
|
|||
|
|
color: Cesium.Color.fromCssColorString(colorStr),
|
|||
|
|
duration:5000
|
|||
|
|
}),
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
loadTileset(viewer,tilesetUrl,deep=-45) {
|
|||
|
|
let vm = this;
|
|||
|
|
let tileset = new Cesium.Cesium3DTileset({
|
|||
|
|
url: tilesetUrl,
|
|||
|
|
maximumScreenSpaceError:8,
|
|||
|
|
dynamicScreenSpaceError: true,
|
|||
|
|
dynamicScreenSpaceErrorDensity: 0.00278,
|
|||
|
|
dynamicScreenSpaceErrorFactor: 4.0,
|
|||
|
|
dynamicScreenSpaceErrorHeightFalloff: 0.25,
|
|||
|
|
});
|
|||
|
|
viewer.scene.primitives.add(tileset);
|
|||
|
|
tileset.readyPromise.then(function (tileset_) {
|
|||
|
|
vm.setTilesetHeightAndOffset(tileset_, deep);
|
|||
|
|
});
|
|||
|
|
return tileset;
|
|||
|
|
},
|
|||
|
|
setTilesetHeightAndOffset(tileset, height, x, y) {
|
|||
|
|
x = x ? x : 0;
|
|||
|
|
y = y ? y : 0;
|
|||
|
|
let center;
|
|||
|
|
if (tileset.boundingSphere) {
|
|||
|
|
// 3dtiles
|
|||
|
|
center = tileset.boundingSphere.center;
|
|||
|
|
} else if (
|
|||
|
|
tileset._boundingSpheres &&
|
|||
|
|
tileset._boundingSpheres.length > 0
|
|||
|
|
) {
|
|||
|
|
// Primitive
|
|||
|
|
center = tileset._boundingSpheres[0].center;
|
|||
|
|
}
|
|||
|
|
const cartographic = Cesium.Cartographic.fromCartesian(center);
|
|||
|
|
const surface = Cesium.Cartesian3.fromRadians(
|
|||
|
|
cartographic.longitude,
|
|||
|
|
cartographic.latitude,
|
|||
|
|
0.0
|
|||
|
|
);
|
|||
|
|
const offset = Cesium.Cartesian3.fromRadians(
|
|||
|
|
cartographic.longitude + x,
|
|||
|
|
cartographic.latitude + y,
|
|||
|
|
height
|
|||
|
|
);
|
|||
|
|
const translation = Cesium.Cartesian3.subtract(
|
|||
|
|
offset,
|
|||
|
|
surface,
|
|||
|
|
new Cesium.Cartesian3()
|
|||
|
|
);
|
|||
|
|
const modelMaxtrix = Cesium.Matrix4.fromTranslation(translation);
|
|||
|
|
tileset.modelMatrix = modelMaxtrix;
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default viewUtil;
|