diff --git a/src/views/components/xiaoqu/map/index.vue b/src/views/components/xiaoqu/map/index.vue
index c8b7d23..33115ce 100644
--- a/src/views/components/xiaoqu/map/index.vue
+++ b/src/views/components/xiaoqu/map/index.vue
@@ -8,6 +8,7 @@
import configJson from "./map-config.json";
import garden from "./garden.json";
import MarsMap from "@/components/mars-map";
+import stylus from "highlight.js/lib/languages/stylus";
export default {
props: {
xiaoquId: {
@@ -74,7 +75,7 @@ export default {
this.mapLayer.planePoint = new mars3d.layer.GraphicLayer();
this.map.addLayer(this.mapLayer.planePoint);
- this.mapLayer.network = new mars3d.layer.GraphicLayer();
+ this.mapLayer.network = new mars3d.layer.GraphicLayer({ show: false });
this.map.addLayer(this.mapLayer.network);
},
addMapLayer() {
@@ -90,9 +91,11 @@ export default {
) {
this.addGardenLayer();
}
- // this.addbuildingLayer();
this.addNetworkLayer();
+ this.addbuildingLayer();
+
+ this.add3DXiaoqu();
},
//商铺面
addshop() {
@@ -283,7 +286,6 @@ export default {
},
});
this.mapLayer.plane.addGraphic(polygon);
-
const point = new mars3d.graphic.BillboardEntity({
id: `planePoint${index}`,
position: polygon.centerPoint,
@@ -313,9 +315,12 @@ export default {
},
},
attr: {
- id: index,
- yuanName: yuanName,
- buildingNumber: buildingNumber,
+ ...item.attr,
+ ...{
+ id: index,
+ yuanName: yuanName,
+ buildingNumber: buildingNumber,
+ },
},
});
point.on(mars3d.EventType.click, function (e) {
@@ -354,12 +359,64 @@ export default {
outline: true,
outlineWidth: 3,
outlineColor: "#32FF85",
+ highlight: {
+ type: "click",
+ color: "#FF3992",
+ opacity: 0.5,
+ outline: true,
+ outlineColor: "#FF129D",
+ outlineWidth: 5,
+ },
},
});
this.mapLayer.network.addGraphic(polygon);
});
});
},
+
+ //3D小区模型
+ add3DXiaoqu() {
+ //4D显存 - 集显
+ let maximumMemoryUsage =
+ process.env.NODE_ENV === "production" ? (1024 * 4) / 2 : 1024 / 2;
+ // 倾斜模型
+ this.mapLayer.tiles3dLayer = new mars3d.layer.TilesetLayer({
+ show: false,
+ name: "太仓测试",
+ url: this.config.qingxie.url,
+ maximumScreenSpaceError: 16,
+ maximumMemoryUsage: maximumMemoryUsage,
+ dynamicScreenSpaceError: false,
+ skipLevelOfDetail: true,
+ preferLeaves: true,
+ flyTo: false,
+ center: this.config.viewHome,
+ });
+ this.map.addLayer(this.mapLayer.tiles3dLayer);
+ },
+ //3D
+ handle3D() {
+ this.mapLayer.tiles3dLayer.show = true;
+
+ //修改二维图标成为三维
+ this.mapLayer.planePoint.eachGraphic((graphic) => {
+ let attr = graphic.attr;
+ var centerPoint = graphic.centerPoint;
+ centerPoint.alt = Number(attr["层数"]) * 3 + 10;
+ graphic.setOptions({
+ position: centerPoint,
+ style: {
+ width: 30,
+ height: 30,
+ clampToGround: false,
+ label: {
+ clampToGround: false, //贴地
+ height: centerPoint.alt,
+ },
+ },
+ });
+ });
+ },
},
};
diff --git a/src/views/xiaoqu.vue b/src/views/xiaoqu.vue
index 65457cb..a61fcd3 100644
--- a/src/views/xiaoqu.vue
+++ b/src/views/xiaoqu.vue
@@ -5,6 +5,10 @@
:showStreet="false"
>