突发事件模拟文字及位置调整

shuishen

2024-11-25 e73e627dc546730f78e172ac40249490e4ecd5d3

突发事件模拟文字及位置调整

 src/views/pd/components/dynamicPanel.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2024-11-09 15:41:35
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2024-11-25 11:26:01
 * @LastEditTime: 2024-11-25 16:27:34
 * @FilePath: \bigScreen\src\views\pd\components\dynamicPanel.vue
 * @Description: 
 * 
@@ -25,7 +25,7 @@
      title: '典型案例1',
      content: '南片区松节油储罐区泄漏事故: 南片区某企业松节油储罐泄漏，如不采取措施，将造成污染事故，影响到赣江下游水质。',

      oneCentent: '企业关闭前置阀门切断泄漏源，向罐内适量注水，抬高液位。',
      oneCentent: '2024年11月11日11时，南片区江西殷莱特化工有限公司松节油储罐泄漏。企业关闭前置阀门切断泄漏源，向罐内适量注水，抬高液位。',
      onePointPosition: {
        lng: 115.10175740,
        lat: 27.27356477
@@ -54,10 +54,10 @@
      title: '典型案例2',
      content: '北片区碱类腐蚀性物质泄漏事故: 北片区某企业在生产过程中操作失误，大量含碱废水泄漏，如不采取措施，将造成污染事故，影响到赣江下游水质。',

      oneCentent: '企业关闭前置阀门，切断泄漏源，用砂土等筑堤堵截泄漏液体或者引流到安全地点。',
      oneCentent: '2024年09月16日14时，北片区江西东玶科技有限公司在生产过程中操作失误，大量含碱废水泄漏。企业关闭前置阀门，切断泄漏源，用砂土等筑堤堵截泄漏液体或者引流到安全地点。',
      onePointPosition: {
        lng: 115.10505420,
        lat: 27.28806335
        lng: 115.10467136,
        lat: 27.29415383
      },

      twoContent: '园区关闭北区雨水排口，拦截污染水体。',
@@ -68,8 +68,8 @@

      threeContent: '园区启用北区公共应急池，将已拦截废水泵入应急池。',
      threePointPosition: {
        lng: 115.10467136,
        lat: 27.29415383
        lng: 115.10418532,
        lat: 27.29444603
      },

      fourContent: '将拦截废水从应急池中通过北区污水提升泵站转移至绿源污水处理厂进行处置。',
@@ -88,22 +88,28 @@
    {
      key: 3,
      title: '典型案例3',
      content: '危险化学品运输事故: 化工集中区北区（吉兴路以南）某企业的危化品运输车辆金工大道危化品运专用运输道上发生侧翻，大量盐酸流至路面，如不采取措施，将造成污染事故，影响到赣江下游水质。',
      content: '危险化学品运输事故: 北片区某企业某企业的危化品运输车辆发生侧翻，大量盐酸流至路面，如不采取措施，将造成污染事故，影响到赣江下游水质。',

      oneCentent: '调度金龙水库清水，稀释污染团。',
      oneCentent: '2024年09月16日14时，北片区江西粤鹏环保高新技术开发有限公司的危化品运输车辆发生侧翻，大量盐酸流至路面。',
      onePointPosition: {
        lng: 115.10248629,
        lat: 27.28112873
      },

      twoContent: '调度金龙水库清水，稀释污染团。',
      twoPointPosition: {
        lng: 115.10488545,
        lat: 27.27678110
      },

      twoContent: '转输至江西粤鹏环保高新技术开发有限公司事故应急池、初期雨水池。',
      twoPointPosition: {
      threeContent: '转输至江西粤鹏环保高新技术开发有限公司事故应急池、初期雨水池。',
      threePointPosition: {
        lng: 115.10545135,
        lat: 27.28043872
      },

      threeContent: '转输至江西腾龙源环保科技有限公司事故应急池、初期雨水池。',
      threePointPosition: {
      fourContent: '转输至江西腾龙源环保科技有限公司事故应急池、初期雨水池。',
      fourPointPosition: {
        lng: 115.10332118,
        lat: 27.27831698
      },
@@ -174,16 +180,17 @@
    dynamicHtmlLayer.addOverlay(twoContent)
    // 执行对应的事件函数
    window.$viewer.flyToPosition(new DC.Position(item.twoPointPosition.lng, item.twoPointPosition.lat, 400, 0, -90, 0), () => { }, 3)
  }, 5000)
  }, 10000)

  timeThree = setTimeout(() => {
    let threeCenter = DC.Position.fromObject(item.threePointPosition)
    let threeCircle = new DC.Circle(threeCenter, 30)
    threeCircle.setStyle({
      classificationType: 0,
      material: new DC.CircleSpiralMaterialProperty({
        color: DC.Color.BLUE.withAlpha(0.2),
        speed: 8.0
      material: new DC.CircleWaveMaterialProperty({
        color: DC.Color.fromRandom(),
        speed: 20,
        count: 5,
        gradient: 0.5
      })
    })
    dynamicVectorLayer.addOverlay(threeCircle)
@@ -202,7 +209,7 @@
    dynamicHtmlLayer.addOverlay(threeContent)

    window.$viewer.flyToPosition(new DC.Position(item.threePointPosition.lng, item.threePointPosition.lat, 400, 0, -90, 0), () => { }, 3)
  }, 10000)
  }, 15000)

  item.fourPointPosition && (timeFour = setTimeout(() => {
    let FourCenter = DC.Position.fromObject(item.fourPointPosition)
@@ -231,7 +238,7 @@
    dynamicHtmlLayer.addOverlay(fourContent)
    // 执行对应的事件函数
    window.$viewer.flyToPosition(new DC.Position(item.fourPointPosition.lng, item.fourPointPosition.lat, 400, 0, -90, 0), () => { }, 3)
  }, 15000))
  }, 20000))

  item.fivePointPosition && (timeFive = setTimeout(() => {
    let fiveCenter = DC.Position.fromObject(item.fivePointPosition)
@@ -260,7 +267,7 @@
    dynamicHtmlLayer.addOverlay(fiveContent)
    // 执行对应的事件函数
    window.$viewer.flyToPosition(new DC.Position(item.fivePointPosition.lng, item.fivePointPosition.lat, 400, 0, -90, 0), () => { }, 3)
  }, 20000))
  }, 25000))
}

const clearAll = () => {