a

mods/components/3dviewConvertor/consts/imgStatic.js

@@ -98,7 +98,16 @@ export default {
     risk_3: require('../assets/convertor/3dview/markers/pa-3.png'),
 
     fire: require('../assets/convertor/3dview/markers/fire.png'),
-    fireDetection: require('../assets/convertor/3dview/markers/fireDetector.png')
+    fireDetection: require('../assets/convertor/3dview/markers/fireDetector.png'),
+
+    
+//重点设备模式
+impEquipmentMode_monitorEquipment: require('../assets/convertor/3dview/markers/IeqMode-monitorEquipment.png'),
+impEquipmentMode_impEquipment: require('../assets/convertor/3dview/markers/IeqMode-impEquipment.png'),
+impEquipmentMode_hydrant: require('../assets/convertor/3dview/markers/IeqMode-hydrant.png'),
+impEquipmentMode_pool: require('../assets/convertor/3dview/markers/IeqMode-pool.png'),//
+impEquipmentMode_fireChamber: require('../assets/convertor/3dview/markers/IeqMode-fireChamber.png'),//
+impEquipmentMode_fireCar: require('../assets/convertor/3dview/markers/IeqMode-fireCar.png'),
   },
   color: {
     hydrant: {color: '#f12525'},
@@ -206,5 +215,15 @@ export const marker3DIoncMapper = {
   data_1: '/mods/components/3dviewConvertor/threeres/markers/data-1.png',
 
   croom_0: '/mods/components/3dviewConvertor/threeres/markers/croom-0.png',
-  croom_1: '/mods/components/3dviewConvertor/threeres/markers/croom-1.png'
+  croom_1: '/mods/components/3dviewConvertor/threeres/markers/croom-1.png',
+
+//重点设备模式
+  impEquipmentMode_monitorEquipment: require('../assets/convertor/3dview/markers/IeqMode-monitorEquipment.png'),
+  impEquipmentMode_impEquipment: require('../assets/convertor/3dview/markers/IeqMode-impEquipment.png'),
+  impEquipmentMode_hydrant: require('../assets/convertor/3dview/markers/IeqMode-hydrant.png'),
+  impEquipmentMode_pool: require('../assets/convertor/3dview/markers/IeqMode-pool.png'),//
+  impEquipmentMode_fireChamber: require('../assets/convertor/3dview/markers/IeqMode-fireChamber.png'),//
+  impEquipmentMode_fireCar: require('../assets/convertor/3dview/markers/IeqMode-fireCar.png'),
+
+
 };

mods/components/3dviewConvertor/styles/markers.scss

@@ -232,5 +232,11 @@
     width: 1px;
   }
 }
-
+.three-ui-anchor{
+  white-space: nowrap;
+  width: 90px;
+  text-align: center;
+  color:#cecdcd;
+  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.3) 24%, rgba(0, 0, 0, 0.3) 78%, rgba(255, 255, 255, 0) 100%);
+}
 

mods/components/3dviewConvertor/styles/view/panoramic/statistical.scss

@@ -9,6 +9,7 @@
     width: 350px;
     float: left;
     z-index: 1;
+    color: white;
 
     .equipStatusList{
       padding-left: 97px;
@@ -203,7 +204,7 @@
     top: 0;
 
     z-index: 1;
-    
+
     .echart-week {
       width: 321px !important;
       height: 248px !important;

mods/components/3dviewConvertor/view/View3D.js

@@ -433,7 +433,7 @@ class View3D extends Component {
     let { totalDelta, markerType, showMap } = this.state;
     totalDelta = totalDelta + delta;
     // if (totalDelta < mousewheelCount && showMap) {
-    if(showMap){
+    if(showMap && markerType != "impEquipmentMode"){
       this.asyncLoadMarkerData(markerType);
     }
     // } else if (totalDelta >= mousewheelCount && !showMap) {
@@ -1172,6 +1172,7 @@ class View3D extends Component {
     markers['fireFoamRoom'] = [];
     markers['fireDetection'] = [];
     markers['statistics'] = [];
+    markers['impEquipmentMode'] = [];
     this.setState({
       markers
     });
@@ -1234,7 +1235,7 @@ class View3D extends Component {
         // markers[markerType] = d;
         this.setState({
           markers,
-          // markerType: "monitorEquipment"
+          markerType: "impEquipmentMode"
         });
         return;
     });

mods/components/3dviewConvertor/view/conf.js

@@ -300,7 +300,7 @@ export default {
 
 export const desigerConf = {
   sceneOptions: {
-    background: 0x626667
+    background: 0x070709
     // background: 0x253366,
     // skyBox: 'bluesky'
     // skyBox: ['pos_x', 'neg_x', 'pos_y', 'neg_y', 'pos_z', 'neg_z'].map(item => `/threeres/bg/bluesky2/${item}.jpg`)

mods/components/3dviewConvertor/view/points/MarkerIcon.js

@@ -12,7 +12,7 @@ const markerIoncColorMapper = imgStatic.color;
 const pointIcon = imgStatic.pointIcon;
 
 const getIcon = (markerType, level, type) => {
-  if (markerType === 'riskSource' || markerType === 'risk') {
+  if (markerType === 'riskSource' || markerType === 'risk' || markerType === 'impEquipmentMode') {
     return markerIoncMapper[`${markerType}_${level}`];
   }
   return markerIoncMapper[`${markerType}`];

mods/components/3dviewConvertor/view/points/index.js

@@ -129,7 +129,7 @@ export const PointStatistics = markerFactory(BasicPoint,
 /**
  * 重点设备模式
  */
-export const ImpEquipmentMode = markerFactory(BasicPoint,
+export const ImpEquipmentMode = marker3DFactory(BasicPoint,
   {
     markerType: 'impEquipmentMode'
   }

mods/components/3dviewConvertor/view/points/marker3DFactory.js

@@ -15,6 +15,7 @@ const getIcon = (markerType, level) => {
 const buildMarkerOptions = (markers, markerType, defaultParams = {}) => {
   if (!utils.isEmpty(markers)){
     markers.forEach(m => {
+      debugger;
       const url = getIcon(markerType, m.level);
       let position;
       if (!utils.isArray(m.position)){
@@ -27,11 +28,21 @@ const buildMarkerOptions = (markers, markerType, defaultParams = {}) => {
       m.url = url;
       m.position = utils.isArray(m.position) ? m.position : position;
       m.size = 10;
+      m.label = createMarkerLabel(m.name);
     });
   }
   return markers;
 };
 
+const createMarkerLabel = (text) => {
+  const div = document.createElement('div');
+  div.style.position = 'absolute';
+  div.style.marginTop = '-3rem';
+  div.className = 'three-ui-anchor';
+  div.innerText = text;
+  return div;
+};
+
 export default function marker3DFactory(WrappedComponent = 'div', options){
   const { markerType, markerParams } = options;
   class MarkerPoints extends Component {