const staionJson = { type: "FeatureCollection" }; //定义一个空对象,因为是geojson所以默认加上格式。
//调后端接口
axios
.get(`xxxxxxxxx`)
.then((res) => {
//以下代码将获取到的普通接口json转换为geojson的格式
var features = [];
//res.data.result根据自己的接口格式变更
res.data.results.forEach((i) => {
if (i.lng != null && i.lat != null) {
var feature = {};
feature.type = "Feature";
feature.properties = {
address: i.address,
monitorObj: i.monitorObj,
stcd: i.stcd,
};
var geometry = {};
geometry.coordinates = [i.lng, i.lat];
geometry.type = "Point";
feature.geometry = geometry;
features.push(feature);
}
});
staionJson.features = features;
//到这里,stationJson已经是成型的geojson数据了。
//接下来将数据转成文件形式
const blob = new Blob([JSON.stringify(staionJson)], {
type: "application/json",
});
//接下来调用mars3d画点方法
const staionPoints = new mars3d.layer.GeoJsonLayer({
name: "站点",
url: URL.createObjectURL(blob), //获取到刚刚得到的geojson文件地址
symbol: {
styleOptions: {
image: "img/pointNormal.jpg",//自己的图片路径
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
scale: 1,
scaleByDistance: true,
scaleByDistance_far: 20000,
scaleByDistance_farValue: 0.5,
scaleByDistance_near: 1000,
scaleByDistance_nearValue: 1,
label: {
text: "123",
font_size: 25,
color: "red",
outline: true,
outlineColor: "#000000",
pixelOffsetY: -25,
scaleByDistance: true,
scaleByDistance_far: 80000,
scaleByDistance_farValue: 0.5,
scaleByDistance_near: 1000,
scaleByDistance_nearValue: 1,
distanceDisplayCondition: true,
distanceDisplayCondition_far: 80000,
distanceDisplayCondition_near: 0,
},
},
},
popup: "xxx",
});
map.addLayer(staionPoints);
});
mars3d 用后端传来的数据画点
最新推荐文章于 2024-05-23 16:25:43 发布