代码优化

f2d32861 · 628f27b3fb72c14e897fac6b · e739e670 · f2d32861 · f2d32861 · f2d32861
4 changed file
--- a/public/index.html
+++ b/public/index.html
@@ -11,7 +11,7 @@
    <script src="static/echarts.min.js"></script>
    <script src="static/EchartsLayer.js"></script>
    <script type="text/javascript" src="https://www.supermapol.com/earth/vue-iEarth/static/Cesium/Cesium.js"></script>
-
+    <!-- <script type="text/javascript" src="static/Cesium.js"></script> -->
  </head>
  <body>
    <noscript>

--- a/public/static/Cesium.js
+++ b/public/static/Cesium.js
--- a/src/components/fans-3d.vue
+++ b/src/components/fans-3d.vue
@@ -30,8 +30,6 @@
 <script setup>
 import { ref, onMounted } from "vue";
 import { useRouter } from "vue-router";
-import { ArrowDown } from "@element-plus/icons-vue";
-import { ElMessage } from "element-plus";
 import { getFansInfo, getFansDistribution } from "@/api/apiList.js";
 import { fa } from "element-plus/es/locale";
 const $router = useRouter();
@@ -42,6 +40,7 @@ let echartsLayer = null;
 onMounted(() => {
  getFansInfoData();
 });
+//获取粉丝数据
 const getFansInfoData = () => {
  getFansInfo().then((res) => {
    if (res.code == 200) {
@@ -50,6 +49,7 @@ const getFansInfoData = () => {
    }
  });
 };
+//初始化三维场景
 const initCesuim3D = (result) => {
  viewer = new Cesium.Viewer("cesiumContainer", {});
  var imageryLayers = viewer.imageryLayers;
@@ -58,7 +58,6 @@ const initCesuim3D = (result) => {
    new Cesium.CGCS2000MapServerImageryProvider({
      url: "http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineStreetPurplishBlue/MapServer",
      suggest: true, //4490坐标系，按照suggest切片方案切的瓦片,需要设置该参数
-      // tilingScheme: new Cesium.ArcGisGeographicTilingScheme({})
    })
  );
  var labelImagery = new Cesium.TiandituImageryProvider({
@@ -67,19 +66,7 @@ const initCesuim3D = (result) => {
  });
  imageryLayers.addImageryProvider(labelImagery);

-  const convertData = function (data) {
-    const res = [];
-    for (let i = 0; i < data.length; i++) {
-      const geoCoord = geoCoordMap[data[i].name];
-      if (geoCoord) {
-        res.push({
-          name: data[i].name,
-          value: geoCoord.concat(data[i].value),
-        });
-      }
-    }
-    return res;
-  };
+  //echart数据组装
  result.forEach((ele) => {
    ele.name = ele.city;
    ele.value = ele.gps.concat(ele.score);
@@ -178,18 +165,10 @@ const initCesuim3D = (result) => {
      },
    ],
  };
-
  echartsLayer = new EchartsLayer(viewer);
  echartsLayer.chart.setOption(options);
-
-  // let handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-  // handler.setInputAction(function (e) {
-  //   let pos = scene.pickPosition(e.position);
-  //   console.log(pos);
-  // }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-  // window.camera = scene.camera;
 };
-
+//获取粉丝分布及实现迁徙图
 const getFansDistributionData = (result) => {
  allFansFlag.value = true;
  let startData = result;
@@ -197,31 +176,12 @@ const getFansDistributionData = (result) => {
    if (res.code == 200) {
      var planePath =
        "path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z";
-
-      var convertData = function (data) {
-        var res = [];
-        for (var i = 0; i < data.length; i++) {
-          var dataItem = data[i];
-          var fromCoord = geoCoordMap[dataItem[0].name];
-          var toCoord = geoCoordMap[dataItem[1].name];
-          if (fromCoord && toCoord) {
-            res.push({
-              fromName: dataItem[0].name,
-              toName: dataItem[1].name,
-              coords: [fromCoord, toCoord],
-              value: dataItem[1].value,
-            });
-          }
-        }
-        return res;
-      };
-      res.data.forEach((ele) => {
+        res.data.forEach((ele) => {
        ele.fromName = ele.city;
        ele.toName = startData.city;
        ele.coords = [startData.gps, ele.gps];
        ele.value = ele.score;
      });
-
      var color = ["#00EAFF", "green", "blue"];
      var series = [];
      [[startData.city, res.data]].forEach(function (item, i) {
@@ -288,6 +248,7 @@ const getFansDistributionData = (result) => {
  });
 };

+//返回至粉丝榜
 const backStep = () => {
  allFansFlag.value = false;
  getFansInfo().then((res) => {

--- a/src/components/force-3d.vue
+++ b/src/components/force-3d.vue
@@ -34,14 +34,11 @@ import { ElMessage } from "element-plus";
 import { getForceInfo } from "@/api/apiList.js";

 const $router = useRouter();
-
 const tableData = ref([]);
 onMounted(() => {
-  // setTimeout(() => {
-  //   initCesuim3D();
-  // }, 1000);
  getForceInfoData();
 });
+//获取原力数据
 const getForceInfoData = () => {
  getForceInfo().then((res) => {
    if (res.code == 200) {
@@ -50,7 +47,7 @@ const getForceInfoData = () => {
    }
  });
 };
-
+//初始化3d
 const initCesuim3D = (result) => {
  var viewer = new Cesium.Viewer("cesiumContainer", {});
  var imageryLayers = viewer.imageryLayers;
@@ -68,22 +65,7 @@ const initCesuim3D = (result) => {
  });
  imageryLayers.addImageryProvider(labelImagery);

-  var planePath =
-    "path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z";
-
-  const convertData = function (data) {
-    const res = [];
-    for (let i = 0; i < data.length; i++) {
-      const geoCoord = geoCoordMap[data[i].name];
-      if (geoCoord) {
-        res.push({
-          name: data[i].name,
-          value: geoCoord.concat(data[i].value),
-        });
-      }
-    }
-    return res;
-  };
+  //数据组装
  result.forEach((ele) => {
    ele.name = ele.city;
    ele.value = ele.gps.concat(ele.score);
@@ -188,19 +170,15 @@ const initCesuim3D = (result) => {

  var echartsLayer = new EchartsLayer(viewer);
  echartsLayer.chart.setOption(options);
-
-  let handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-  handler.setInputAction(function (e) {
-    let pos = scene.pickPosition(e.position);
-    console.log(pos);
-  }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-  // window.camera = scene.camera;
 };

+//跳转博客
 const gotoBlog = (val) => {
  let url = "https://blog.csdn.net/" + val.username;
  window.open(url);
 };
+
+
 </script>
 <style lang="less">
 .force3d {