fangyuan
2022-12-15 0bc97726ed2c14d075557ef897d0d8b1ecfe5c4f
src/views/intelligentPatrol/trendAnalysis/index.vue
@@ -35,6 +35,10 @@
      </div>
    </div>
    <div class="trend-main">
      <div class="map">
            <MyMap :point="point" :zoom="zoom" :mark="mark"></MyMap>
      </div>
      <div class="trend-main-echarts" id="echarts">
      </div>
@@ -46,8 +50,10 @@
import * as echarts from 'echarts'
import basecase from "@/api/operate/basecase";
import { CATEGOTY } from "@/utils/helper";
import MyMap from "@/components/map";
export default {
  components :{MyMap},
  created() {
    this.searchList()
  },
@@ -72,7 +78,10 @@
      trendAnalysisList: [],
      highFlag: true,
      echarts: null,
      pointName: null
      pointName: null,
      point: null,
      mark: null,
      zoom: null,
    }
  },
  methods: {
@@ -115,7 +124,13 @@
    pointClick(data) {
      this.pointName = data.name;
      basecase.getPointTrendAnalysisData({ id: data.id })
      this.point = {
            x: data.longitude,
            y: data.latitude,
          };
      this.zoom = 19;
      this.mark = { title: data.address };
      basecase.getPointTrendAnalysisData({ longitude: data.longitude,latitude: data.latitude })
          .then(res => {
            const countList = res.map(item => +item.count);
            this.renderEchart(countList);
@@ -129,7 +144,7 @@
<style lang="scss" scoped>
.trend-analysis {
  height: 100%;
  padding: 10vh 10vw;
  padding: 10vh 0vw;
  color: #4b9bb7;
  display: flex;
@@ -185,7 +200,7 @@
  .trend-main {
    flex: 1;
    border: 1px solid #09152f;
    display: flex;
    .trend-main-echarts {
      width: 500px;
      height: 400px;
@@ -198,4 +213,8 @@
    }
  }
}
.map {
  height: 488px;
  min-width: 460px;
}
</style>