提交

package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "description": "",
   "scripts": {
-    "dev": "vite --host --open",
+    "dev": "vite",
     "build": "vite build",
     "serve": "vite preview"
   },

src/assets/style/BigScreenHome.css

@@ -224,3 +224,13 @@
   border-radius: 2px;
   visibility: hidden;
 }
+
+.tabIcon {
+    width: 100%;
+    vertical-align: middle;
+    margin-right: 3px;
+}
+
+.newMdia{
+    width: 100%;
+}

src/assets/style/Fifth.css

@@ -1,3 +0,0 @@
-.FifthLayout .chart3 {
-    width: 100%;
-}

src/assets/style/Fourth.css

@@ -1,114 +0,0 @@
-.FourthLayout .chart3 {
-    width: 100%;
-}
-
-.FourthLayout .timeSub {
-    height: 1rem;
-    line-height: 1rem;
-    padding: 0 .5em;
-    text-align: right;
-}
-
-.FourthLayout .heightWord {
-    background-image: url("../img//wordCloud.png");
-    background-size: 100% 100%;
-    background-repeat: no-repeat;
-}
-
-.FourthLayout .numberFonts {
-    display: inline-block;
-    font-size: .4rem;
-}
-
-.FourthLayout .numberFonts:first-child {
-    margin-right: 2em;
-}
-
-.FourthLayout .numberFonts span {
-    font-family: "numberFonts";
-    vertical-align: middle;
-    background-color: #025B70;
-    display: inline-block;
-    border-radius: .06rem;
-    font-size: .6rem;
-    padding: 0 .2em;
-    margin: 0 .1rem;
-}
-
-.FourthLayout .dataTotal .error {
-    float: right;
-    height: 100%;
-    font-size: .14rem;
-    padding-right: 5em;
-    padding-top: 2em;
-    padding-bottom: 2em;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-}
-
-.FourthLayout .dataTotal .error>div {
-    height: 9em;
-}
-
-.FourthLayout .dataTotal .data {
-    text-align: center;
-    padding-top: 2em;
-    position: relative;
-}
-
-.FourthLayout .dataTotal .data .img {
-    width: 100%;
-    position: relative;
-}
-
-.FourthLayout .img img {
-    display: block;
-    position: absolute;
-    left: 50%;
-    transform: translate(-50%);
-}
-
-.FourthLayout .dataTotal .data .allData,
-.FourthLayout .dataTotal .data .filterData,
-.FourthLayout .dataTotal .data .proData {
-    position: absolute;
-}
-
-.FourthLayout .dataTotal .data .arrow {
-    position: absolute;
-    right: -35px;
-    transform: rotate(180deg);
-}
-
-.FourthLayout .dataTotal .data .arrow_left{
-    transform: rotate(0deg);
-    left: -35px;
-}
-
-.FourthLayout .dataTotal .data .allData {
-    left: 0;
-    top: 2em
-}
-
-.FourthLayout .dataTotal .data .filterData {
-    left: 0;
-    top: 9em;
-}
-
-.FourthLayout .dataTotal .data .proData {
-    right: 0;
-    top: 9em;
-}
-
-.FourthLayout .allData>p {
-    color: #3de9e9;
-}
-
-.FourthLayout .filterData>p {
-    color: #3770ef;
-}
-
-.FourthLayout .proData>p {
-    color: #23c459;
-}

src/assets/style/Second.css

@@ -1,84 +0,0 @@
-.SecondStyle {
-    position: relative;
-    padding-top: 0;
-    width: 100%;
-    height: 100vh;
-}
-
-.SecondStyle .SecondTitle {
-    text-align: center;
-    position: absolute;
-    z-index: 1;
-    width: 100%;
-}
-
-.SecondStyle .T {
-    padding: .6rem 0 .1rem 0;
-}
-
-.SecondStyle .STitle {
-    width: 10rem;
-    height: 1rem;
-    line-height: 1rem;
-    font-size: .5rem;
-    font-weight: 600;
-    margin: 0 auto;
-    background-image: url('/src/assets/img/T.png');
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-}
-
-.SecondStyle .select {
-    color: #21fb77;
-    background: linear-gradient(180deg, #1bd1e9, #038689);
-}
-
-.button {
-    background-color: #016565;
-    font-size: .3rem;
-    display: inline-block;
-    height: 100%;
-    width: 2rem;
-    height: 2em;
-    line-height: 1.5em;
-    cursor: pointer;
-}
-
-.btnGroup {
-    vertical-align: middle;
-    border: 1px solid #00bff6;
-    border-radius: 3px;
-    display: inline-block;
-    width: 4.05rem;
-    overflow: hidden;
-    margin-right: 5px;
-}
-
-.SecondStyle #map1 {
-    position: absolute;
-    width: 100vw;
-    height: 100vh;
-    top: 0
-}
-
-.SecondStyle .secTableleft,
-.SecondStyle .secTableright {
-    top: 15vh;
-    z-index: 2;
-    left: 30px;
-    width: 30vw;
-    height: 70vh;
-    padding: 1em;
-    border-radius: 5px;
-    position: absolute;
-    background-color: rgba(0, 0, 0, .5);
-}
-
-.SecondStyle .secTableleft {
-    left: initial;
-    right: 30px;
-}
-
-.SecondStyle .l7-popup-content{
-    color: #000
-}

src/assets/style/first.css

@@ -1,84 +0,0 @@
-.FirstStyle {
-    position: relative;
-    padding-top: 0;
-    width: 100%;
-    height: 100vh;
-}
-
-.FirstStyle .FirstTitle {
-    text-align: center;
-    position: absolute;
-    z-index: 1;
-    width: 100%;
-}
-
-.FirstStyle .T {
-    padding: .6rem 0 .1rem 0;
-}
-
-.FirstStyle .STitle {
-    width: 10rem;
-    height: 1rem;
-    line-height: 1rem;
-    font-size: .5rem;
-    font-weight: 600;
-    margin: 0 auto;
-    background-image: url('/src/assets/img/T.png');
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-}
-
-.FirstStyle .select {
-    color: #21fb77;
-    background: linear-gradient(180deg, #1bd1e9, #038689);
-}
-
-.button {
-    background-color: #016565;
-    font-size: .3rem;
-    display: inline-block;
-    height: 100%;
-    width: 2rem;
-    height: 2em;
-    line-height: 1.5em;
-    cursor: pointer;
-}
-
-.btnGroup {
-    vertical-align: middle;
-    border: 1px solid #00bff6;
-    border-radius: 3px;
-    display: inline-block;
-    width: 4.05rem;
-    overflow: hidden;
-    margin-right: 5px;
-}
-
-.FirstStyle #map1 {
-    position: absolute;
-    width: 100vw;
-    height: 100vh;
-    top: 0
-}
-
-.FirstStyle .secTableleft,
-.FirstStyle .secTableright {
-    top: 15vh;
-    z-index: 2;
-    left: 30px;
-    width: 30vw;
-    height: 70vh;
-    padding: 1em;
-    border-radius: 5px;
-    position: absolute;
-    background-color: rgba(0, 0, 0, .5);
-}
-
-.FirstStyle .secTableleft {
-    left: initial;
-    right: 30px;
-}
-
-.FirstStyle .l7-popup-content{
-    color: #000
-}

src/pages/Fifth.jsx

@@ -1,521 +0,0 @@
-import { onMount } from "solid-js"
-import { Chart } from '@antv/g2';
-import DataSet from '@antv/data-set';
-
-import ItemHead from "../components/itemHead";
-import Table from "../components/table";
-
-
-
-import "../assets/style/Fifth.css"
-
-let WordEle;
-
-function TrendChart() {
-  const data = [
-    { year: '1991', value: 15468 },
-    { year: '1992', value: 16100 },
-    { year: '1993', value: 15900 },
-    { year: '1994', value: 17409 },
-    { year: '1995', value: 17000 },
-    { year: '1996', value: 31056 },
-    { year: '1997', value: 31982 },
-    { year: '1998', value: 32040 },
-    { year: '1999', value: 33233 },
-  ];
-  const chart = new Chart({
-    container: 'Trend',
-    autoFit: true,
-    height: WordEle.offsetHeight - 110,
-    renderer: 'svg',
-    padding: [20, 20, 30, 50],
-  });
-
-  chart.data(data);
-  chart.scale({
-    value: {
-      min: 10000,
-      nice: true,
-    },
-    year: {
-      range: [0, 1],
-    },
-  });
-  chart.tooltip({
-    showCrosshairs: true,
-    shared: true,
-  });
-
-  chart.axis('value', {
-    label: {
-      formatter: (val) => {
-        return (val / 1000).toFixed(1) + 'k';
-      },
-    },
-  });
-
-  chart.area().position('year*value').shape('smooth');
-  chart.line().position('year*value').shape('smooth');
-
-  chart.render();
-}
-
-function RectChart() {
-  const { DataView } = DataSet;
-  const mobiles = [
-    {
-      "name": "三星",
-      "brand": "三星",
-      "value": 16.711901453726654,
-      "children": [
-        {
-          "name": "三星Galaxy Note II",
-          "value": 2.1588
-        },
-        {
-          "name": "其他",
-          "value": 0.6569
-        }
-      ]
-    },
-    {
-      "name": "华为",
-      "brand": "华为",
-      "value": 8.45923464256909,
-      "children": [
-        {
-          "name": "华为荣耀3X",
-          "value": 0.4411
-        },
-        {
-          "name": "其他",
-          "value": 0.3379
-        }
-      ]
-    },
-    {
-      "name": "小米",
-      "brand": "小米",
-      "value": 8.168930119898944,
-      "children": [
-        {
-          "name": "小米手机M3",
-          "value": 2.5106
-        },
-        {
-          "name": "其他",
-          "value": 0.1195
-        }
-      ]
-    },
-    {
-      "name": "红米",
-      "brand": "红米",
-      "value": 6.860016513545617,
-      "children": [
-        {
-          "name": "红米手机1s",
-          "value": 2.0981
-        },
-        {
-          "name": "其他",
-          "value": 0.047
-        }
-      ]
-    },
-    {
-      "name": "vivo",
-      "brand": "vivo",
-      "value": 6.6900485928653595,
-      "children": [
-        {
-          "name": "vivo X3T",
-          "value": 0.5202
-        },
-        {
-          "name": "其他",
-          "value": 0.2509
-        }
-      ]
-    },
-    {
-      "name": "联想",
-      "brand": "联想",
-      "value": 4.83119057920539,
-      "children": [
-        {
-          "name": "联想A320T",
-          "value": 0.2273
-        },
-        {
-          "name": "其他",
-          "value": 0.1887
-        }
-      ]
-    },
-    {
-      "name": "OPPO",
-      "brand": "OPPO",
-      "value": 4.724206371886631,
-      "children": [
-        {
-          "name": "OPPO 1107",
-          "value": 0.3173
-        },
-        {
-          "name": "其他",
-          "value": 0.1877
-        }
-      ]
-    },
-    {
-      "name": "酷派",
-      "brand": "酷派",
-      "value": 4.600366818169094,
-      "children": [
-        {
-          "name": "酷派8720L",
-          "value": 0.293
-        },
-        {
-          "name": "其他",
-          "value": 0.1828
-        }
-      ]
-    },
-    {
-      "name": "魅族",
-      "brand": "魅族",
-      "value": 1.6772881053417859,
-      "children": [
-        {
-          "name": "魅族m1 note",
-          "value": 0.4044
-        },
-        {
-          "name": "其他",
-          "value": 0.0488
-        }
-      ]
-    },
-    {
-      "name": "中兴",
-      "brand": "中兴",
-      "value": 1.590510084675687,
-      "children": [
-        {
-          "name": "中兴U807",
-          "value": 0.132
-        },
-        {
-          "name": "其他",
-          "value": 0.0615
-        }
-      ]
-    },
-    {
-      "name": "金立",
-      "brand": "金立",
-      "value": 1.526388460481574,
-      "children": [
-        {
-          "name": "金立GN151",
-          "value": 0.2131
-        },
-        {
-          "name": "其他",
-          "value": 0.0603
-        }
-      ]
-    },
-    {
-      "name": "HTC",
-      "brand": "HTC",
-      "value": 1.481608507729738,
-      "children": [
-        {
-          "name": "HTC One",
-          "value": 0.1727
-        },
-        {
-          "name": "其他",
-          "value": 0.0583
-        }
-      ]
-    },
-    {
-      "name": "索尼",
-      "brand": "索尼",
-      "value": 1.2413739743388843,
-      "children": [
-        {
-          "name": "索尼Xperia Z3",
-          "value": 0.2293
-        },
-        {
-          "name": "其他",
-          "value": 0.0463
-        }
-      ]
-    },
-    {
-      "name": "海信",
-      "brand": "海信",
-      "value": 0.6904937214414083,
-      "children": [
-        {
-          "name": "海信 HS-X8T",
-          "value": 0.0321
-        },
-        {
-          "name": "其他",
-          "value": 0.0267
-        }
-      ]
-    },
-    {
-      "name": "天语",
-      "brand": "天语",
-      "value": 0.5429533549715655,
-      "children": [
-        {
-          "name": "天语Touch3",
-          "value": 0.0498
-        },
-        {
-          "name": "其他",
-          "value": 0.0217
-        }
-      ]
-    },
-    {
-      "name": "TCL",
-      "brand": "TCL",
-      "value": 0.3655895764217495,
-      "children": [
-        {
-          "name": "TCL P301M",
-          "value": 0.0787
-        },
-        {
-          "name": "其他",
-          "value": 0.0136
-        }
-      ]
-    },
-    {
-      "name": "努比亚",
-      "brand": "努比亚",
-      "value": 0.3532994868802954,
-      "children": [
-        {
-          "name": "努比亚NX505J",
-          "value": 0.1058
-        },
-        {
-          "name": "努比亚NX503A",
-          "value": 0.0202
-        }
-      ]
-    },
-    {
-      "name": "LG",
-      "brand": "LG",
-      "value": 0.32957718500706507,
-      "children": [
-        {
-          "name": "LG Nexus4",
-          "value": 0.1412
-        },
-        {
-          "name": "其他",
-          "value": 0.0124
-        }
-      ]
-    },
-    {
-      "name": "朵唯",
-      "brand": "朵唯",
-      "value": 0.2858420985694951,
-      "children": [
-        {
-          "name": "朵唯S1",
-          "value": 0.0254
-        },
-        {
-          "name": "其他",
-          "value": 0.0097
-        }
-      ]
-    },
-    {
-      "name": "全志",
-      "brand": "全志",
-      "value": 0.27148714077502867,
-      "children": [
-        {
-          "name": "SoftwinerEvb",
-          "value": 0.2714
-        },
-        {
-          "name": "其他",
-          "value": 0.0001
-        }
-      ]
-    },
-    {
-      "name": "摩托罗拉",
-      "brand": "摩托罗拉",
-      "value": 0.2629327830198232,
-      "children": [
-        {
-          "name": "摩托罗拉Atrix 4G",
-          "value": 0.0308
-        },
-        {
-          "name": "其他",
-          "value": 0.0098
-        }
-      ]
-    },
-    {
-      "name": "台电",
-      "brand": "台电",
-      "value": 0.12471093194559665,
-      "children": [
-        {
-          "name": "台电A11",
-          "value": 0.0975
-        },
-        {
-          "name": "其他",
-          "value": 0.004
-        }
-      ]
-    }
-  ]
-  mobiles.forEach(function (mobile) {
-    mobile.value = null;
-  });
-  const data = {
-    name: 'root',
-    children: mobiles,
-  };
-  const dv = new DataView();
-  dv.source(data, {
-    type: 'hierarchy',
-  }).transform({
-    field: 'value',
-    type: 'hierarchy.treemap',
-    tile: 'treemapResquarify',
-    as: ['x', 'y'],
-  });
-  // 将 DataSet 处理后的结果转换为 G2 接受的数据
-  const nodes = [];
-  for (const node of dv.getAllNodes()) {
-    if (!node.children) {
-      const eachNode = {
-        name: node.data.name,
-        x: node.x,
-        y: node.y,
-        depth: node.depth,
-        value: node.value,
-      };
-      if (!node.data.brand && node.parent) {
-        eachNode.brand = node.parent.data.brand;
-      } else {
-        eachNode.brand = node.data.brand;
-      }
-
-      nodes.push(eachNode);
-    }
-  }
-  const chart = new Chart({
-    container: 'rect',
-    autoFit: true,
-    height: WordEle.offsetHeight - 110,
-    padding: 0,
-  });
-  chart.coordinate().scale(1, -1); // 习惯性最小的在最下面
-  chart.data(nodes);
-  chart.axis(false);
-  chart.legend(false);
-  chart.tooltip({
-    showTitle: false,
-    showMarkers: false
-  });
-  chart
-    .polygon()
-    .position('x*y')
-    .color('brand')
-    .tooltip('name*value', function (name, value) {
-      return {
-        name,
-        value,
-      };
-    })
-    .style({
-      lineWidth: 1,
-      stroke: '#fff',
-    })
-    .label(
-      'name',
-      {
-        offset: 0,
-        style: {
-          textBaseline: 'middle',
-          fill: '#000',
-          shadowBlur: 10,
-          shadowColor: '#fff',
-        },
-        layout: {
-          type: 'limit-in-shape'
-        }
-      }
-    );
-  chart.interaction('element-active');
-  chart.render();
-}
-
-function fifth() {
-  onMount(() => {
-    TrendChart()
-    RectChart()
-  })
-  const tHead = [{ text: '发布时间', type: 'Text' }, { text: '信息来源', type: 'Text' }, { text: '信息标题', type: 'Text', flex: 2 }];
-  const tBody = [
-    {
-      color: "",
-      col: [
-        { text: '31分钟前', type: 'Text', color: "rgb(215 1 1 / 60%)", flex: 1 },
-        { text: '懂车帝', type: 'Text', color: "rgb(215 1 1 / 60%)", flex: 1 },
-        {
-          flex: 2,
-          text: '国足又输了 [流泪][流泪][流泪] 孔老二搬家 ……尽是书 说实话，怪不了这帮小子，他们尽力了，他们也就这能耐。 没有高考不行! 但是，高考为大众目标的教育，必然导致足球人口畸少而且素质极差。 此题',
-          type: 'Scroll',
-          color: "rgb(215 1 1 / 60%)"
-        }
-      ]
-    }
-  ]
-  return (
-    <div class="page row FifthLayout">
-      <div class="col1">
-        <ItemHead title="专题监测信息" subtitle="Thematic monitoring information" />
-        <Table head={tHead} body={tBody} />
-      </div>
-      <div class="col1">
-        <div class="height50" ref={WordEle}>
-          <ItemHead title="倾向趋势" subtitle="Tendency Trend" />
-          <div class="chart3" id="Trend"></div>
-        </div>
-        <div class="height50">
-          <ItemHead title="聚焦媒体榜" subtitle="Key point propogation node" />
-          <div class="chart" id="rect"></div>
-        </div>
-      </div>
-    </div>
-  );
-}
-
-export default fifth;

src/pages/First.jsx

@@ -1,118 +0,0 @@
-import { onMount, createSignal, For } from "solid-js"
-import { Scene, Marker, Popup } from '@antv/l7';
-// import { ProvinceLayer } from '@antv/l7-district';
-import { GaodeMap } from '@antv/l7-maps';
-
-import Laydate from "../components/laydate"
-
-// import config from "../base/config"
-
-import "../assets/style/first.css"
-
-import Table from "../components/table";
-
-const [tab, setTab] = createSignal(0)
-
-
-async function mapChart() {
-    const scene = new Scene({
-        id: 'map1',
-        logoVisible: false,
-        map: new GaodeMap({
-            center: [108.2825, 36],
-            pitch: 30,
-            style: 'dark',
-            zoom: 6,
-            minZoom: 4,
-            maxZoom: 10
-        })
-    });
-    scene.on('loaded', () => {
-
-        const popup = new Popup({
-            offsets: [0, 20]
-        }).setText('hello');
-
-        const marker = new Marker()
-            .setLnglat([109, 35])
-            .setPopup(popup);
-
-        scene.addMarker(marker);
-        // new CountryLayer(scene, {
-        //     data: [
-        //         {
-        //             value: 1000
-        //         }
-        //     ],
-        //     depth: 1,
-        //     coastlineWidth: 0,
-        //     provinceStrokeWidth: 1,
-        //     provinceStroke: "#2999c0",
-        //     chinaNationalWidth: 1,
-        //     chinaNationalStroke: '#2b3a7c',
-        //     label: {
-        //         size: 14,
-        //         strokeWidth: 0,
-        //         stroke: 'rgba(0,0,0,0)',
-        //         color: "#fff"
-        //     },
-        //     fill: {
-        //         color: {
-        //             field: 'value',
-        //             values: ['rgba(43,58,124, .1)']
-        //         },
-        //         activeColor: false
-        //     },
-        //     popup: {
-        //         enable: false,
-        //     }
-        // });
-    });
-}
-
-function first() {
-    onMount(() => {
-        mapChart()
-    })
-    const tHead = [{ text: '发布时间', type: 'Text' }, { text: '信息来源', type: 'Text' }, { text: '信息标题', type: 'Text', flex: 2 }];
-    const tBody = [
-        {
-            color: "",
-            col: [
-                { text: '31分钟前', type: 'Text', color: "rgb(215 1 1 / 60%)", flex: 1 },
-                { text: '懂车帝', type: 'Text', color: "rgb(215 1 1 / 60%)", flex: 1 },
-                {
-                    flex: 2,
-                    text: '国足又输了 [流泪][流泪][流泪] 孔老二搬家 ……尽是书 说实话，怪不了这帮小子，他们尽力了，他们也就这能耐。 没有高考不行! 但是，高考为大众目标的教育，必然导致足球人口畸少而且素质极差。 此题',
-                    type: 'Scroll',
-                    color: "rgb(215 1 1 / 60%)"
-                }
-            ]
-        }
-    ]
-    console.log("---")
-    return (
-        <div class="page firstStyle">
-            <div class="firstTitle">
-                <div class="T">
-                    <div class="STitle">舆论场态势实时感知</div>
-                </div>
-                <div class="B">
-                    <div class="row btnGroup">
-                        <For each={['全部热点', '行业热点']}>{(v, i) =>
-                            <div class={'col1 button ' + (tab() === i() ? 'select' : '')} tab={i()} onClick={() => setTab(i())}>{v}</div>
-                        }</For>
-                    </div>
-                    <Laydate width="13em" id="laydate" />
-                </div>
-            </div>
-
-            <Table localclass="secTableleft" head={tHead} body={tBody} />
-            <Table localclass="secTableright" head={tHead} body={tBody} />
-
-            <div id="map1"></div>
-        </div>
-    );
-}
-
-export default first;

src/pages/Fourth.jsx

@@ -1,343 +0,0 @@
-import { onMount, createSignal } from "solid-js"
-import DataSet from '@antv/data-set';
-import { Chart } from '@antv/g2';
-
-import utils from "../utils/index"
-
-import ItemHead from "../components/itemHead";
-import Table from "../components/table";
-import Water from "../components/water";
-
-import "../assets/style/Fourth.css"
-
-let WordEle, WordCanvas;
-let lastTime = Date.now();
-window.animationID = -1;
-const [timeDate, setTimeDate] = createSignal(utils.getTime())
-const [itemHeight, setItemHeight] = createSignal(utils.getTime())
-
-function animation() {
-    window.animationID = window.requestAnimFrame(() => {
-    const nowTime = Date.now();
-    window.cancelrequestAnimFrame(window.animationID);
-    animation()
-    if ((nowTime - lastTime) < 1000) return
-    lastTime = nowTime;
-    setTimeDate(utils.getTime())
-  })
-}
-
-function ClassificationChart() {
-  const data = [
-    { item: '执法形象', a: 70, b: 30 },
-    { item: '突发事件', a: 60, b: 70 },
-    { item: '突发事故', a: 50, b: 60 },
-    { item: '涉警、涉公务人员问题', a: 40, b: 50 },
-    { item: '政府形象问题', a: 60, b: 70 },
-    { item: '涉稳事件', a: 70, b: 50 },
-    { item: '治安管理', a: 50, b: 40 },
-    { item: '民生问题', a: 30, b: 40 },
-    { item: '地区重点企业', a: 60, b: 40 },
-    { item: '案件问题', a: 50, b: 60 },
-  ];
-  const { DataView } = DataSet;
-  const dv = new DataView().source(data);
-  dv.transform({
-    type: 'fold',
-    fields: ['a', 'b'], // 展开字段集
-    key: 'user', // key字段
-    value: 'score', // value字段
-    renderer: 'svg'
-  });
-  const chart = new Chart({
-    container: 'Classification',
-    autoFit: true,
-    padding: 20,
-    height: WordEle.offsetHeight - 110,
-  });
-  chart.data(dv.rows);
-  chart.scale('score', {
-    min: 0,
-    max: 80,
-  });
-  chart.coordinate('polar', {
-    radius: 0.8,
-  });
-  chart.tooltip({
-    shared: true,
-    showCrosshairs: true,
-    crosshairs: {
-      line: {
-        style: {
-          lineDash: [4, 4],
-          stroke: '#333'
-        }
-      }
-    }
-  });
-  chart.axis('item', {
-    line: null,
-    tickLine: null,
-    grid: {
-      line: {
-        style: {
-          lineDash: null,
-        },
-      },
-    },
-  });
-  chart.axis('score', {
-    line: null,
-    tickLine: null,
-    grid: {
-      line: {
-        type: 'line',
-        style: {
-          lineDash: null,
-        },
-      },
-    },
-  });
-
-  chart
-    .line()
-    .position('item*score')
-    .color('user')
-    .size(2);
-  chart
-    .point()
-    .position('item*score')
-    .color('user')
-    .shape('circle')
-    .size(4)
-    .style({
-      stroke: '#fff',
-      lineWidth: 1,
-      fillOpacity: 1,
-    });
-  chart
-    .area()
-    .position('item*score')
-    .color('user');
-  chart.render();
-}
-
-function TrendChart() {
-  const data = [
-    { year: '1991', value: 15468 },
-    { year: '1992', value: 16100 },
-    { year: '1993', value: 15900 },
-    { year: '1994', value: 17409 },
-    { year: '1995', value: 17000 },
-    { year: '1996', value: 31056 },
-    { year: '1997', value: 31982 },
-    { year: '1998', value: 32040 },
-    { year: '1999', value: 33233 },
-  ];
-  const chart = new Chart({
-    container: 'Trend',
-    autoFit: true,
-    height: WordEle.offsetHeight - 110,
-    renderer: 'svg',
-    padding: [20, 20, 30, 50],
-  });
-
-  chart.data(data);
-  chart.scale({
-    value: {
-      min: 10000,
-      nice: true,
-    },
-    year: {
-      range: [0, 1],
-    },
-  });
-  chart.tooltip({
-    showCrosshairs: true,
-    shared: true,
-  });
-
-  chart.axis('value', {
-    label: {
-      formatter: (val) => {
-        return (val / 1000).toFixed(1) + 'k';
-      },
-    },
-  });
-
-  chart.area().position('year*value').shape('smooth');
-  chart.line().position('year*value').shape('smooth');
-
-  chart.render();
-}
-
-function WordsChart() {
-  WordCanvas.width = WordEle.offsetWidth
-  WordCanvas.height = WordEle.offsetHeight - 110
-  window.TagCanvas.Start("wordCloud", "tags", {
-    textColour: "#3AEDE4",
-    outlineColour: "rgba(0,0,0,0)",
-    maxSpeed: 0.003,
-    lock: "y",
-  });
-  window.TagCanvas.SetSpeed("wordCloud", [3, 3]);
-}
-
-
-function Fourth() {
-  onMount(() => {
-    ClassificationChart()
-    TrendChart()
-    WordsChart()
-    animation()
-    setItemHeight(WordEle.offsetHeight - 43)
-  })
-  const tHead = [{ text: '发布时间', type: 'Text' }, { text: '信息来源', type: 'Text' }, { text: '信息标题', type: 'Text', flex: 2 }];
-  const tBody = [
-    {
-      color: "",
-      col: [
-        { text: '31分钟前', type: 'Text', color: "rgb(215 1 1 / 60%)", flex: 1 },
-        { text: '懂车帝', type: 'Text', color: "rgb(215 1 1 / 60%)", flex: 1 },
-        {
-          flex: 2,
-          text: '国足又输了 [流泪][流泪][流泪] 孔老二搬家 ……尽是书 说实话，怪不了这帮小子，他们尽力了，他们也就这能耐。 没有高考不行! 但是，高考为大众目标的教育，必然导致足球人口畸少而且素质极差。 此题',
-          type: 'Scroll',
-          color: "rgb(215 1 1 / 60%)"
-        }
-      ]
-    }
-  ]
-  return (
-    <div class="page">
-      <div class="row FourthLayout height50">
-        <div class="col4" style={{"padding":"0 .5em"}}>
-          <div class="timeSub">
-            预警运行时间：
-            <div class="numberFonts">
-              <span>{timeDate().year[2]}</span>
-              <span>{timeDate().year[3]}</span>
-              年
-              <span>{timeDate().month[0]}</span>
-              <span>{timeDate().month[1]}</span>
-              月
-              <span>{timeDate().day[0]}</span>
-              <span>{timeDate().day[1]}</span>
-              日
-            </div>
-            <div class="numberFonts">
-              <span>{timeDate().hour[0]}</span>
-              <span>{timeDate().hour[1]}</span>
-              时
-              <span>{timeDate().min[0]}</span>
-              <span>{timeDate().min[1]}</span>
-              分
-              <span>{timeDate().sec[0]}</span>
-              <span>{timeDate().sec[1]}</span>
-              秒
-            </div>
-          </div>
-          <div class="dataTotal" style={'height: ' + itemHeight() + 'px'}>
-            <img style={{"float":"right"}} src="/src/assets/img/border_right.png" height="100%" />
-            <div class="error">
-              <div>
-                <img src="/src/assets/img/all_error.png" style={{"width":"7em"}} />
-                <div>全部预警</div>
-              </div>
-              <div>
-                <img src="/src/assets/img/public_error.png" style={{"width":"7em"}} />
-                <div>公共预警</div>
-              </div>
-            </div>
-            <img src="/src/assets/img/link.gif" style={{"float":"right","width":"35%","height":"80%","margin-top":"2em"}} />
-            <div class="data" style={{"width":"calc(75% - 1.68rem)","height":"100%"}}>
-              <div class="allData">
-                <div>监测信息总量</div>
-                <img src="/src/assets/img/arrow_right.png" class="arrow" />
-                <p>445349</p>
-              </div>
-              <div class="filterData">
-                <div>排除信息量</div>
-                <img src="/src/assets/img/arrow_right.png" class="arrow" />
-                <p>444393</p>
-              </div>
-              <div class="proData">
-                <div>排除信息占比</div>
-                <img src="/src/assets/img/arrow_right.png" class="arrow arrow_left" />
-                <p>99.79%</p>
-              </div>
-              <div style={{"height":"180px"}}>
-              <div class="img">
-                <img src="/src/assets/img/w1.png" style={{"top":"16px"}} alt="" />
-                <img src="/src/assets/img/w2.png" style={{"top":"106px"}} alt="" />
-              </div>
-              </div>
-              <Water percentage={0.21} text="舆情预警" />
-            </div>
-          </div>
-        </div>
-        <div class="col3">
-          <ItemHead title="预警信息" subtitle="Warning Information" />
-          <Table head={tHead} body={tBody} />
-        </div>
-      </div>
-      <div class="row FourthLayout height50">
-        <div class="col1">
-          <ItemHead title="预警分类" subtitle="Warning Classification" />
-          <div class="chart3" id="Classification"></div>
-        </div>
-        <div class="col1">
-          <ItemHead title="预警趋势" subtitle="Warning Trend" />
-          <div class="chart3" id="Trend"></div>
-        </div>
-        <div class="col1" ref={WordEle}>
-          <ItemHead title="高频热词" subtitle="High-frequency words" />
-          <div class="chart3 heightWord">
-            <canvas id="wordCloud" ref={WordCanvas}></canvas>
-            <div id="tags" class="tags" style={{"display":"none"}}>
-              <ul>
-                <li>
-                  <a href="http://www.google.com" target="_blank">Google</a>
-                </li>
-                <li><a href="/fish">Fish</a></li>
-                <li><a href="/chips">Chips</a></li>
-                <li><a href="/salt">Salt</a></li>
-                <li><a href="/vinegar">Vinegar</a></li>
-                <li>
-                  <a href="http://www.google.com" target="_blank">Google</a>
-                </li>
-                <li><a href="/fish">Fish</a></li>
-                <li><a href="/chips">Chips</a></li>
-                <li><a href="/salt">Salt</a></li>
-                <li><a href="/vinegar">Vinegar</a></li>
-                <li>
-                  <a href="http://www.google.com" target="_blank">Google</a>
-                </li>
-                <li><a href="/fish">Fish</a></li>
-                <li><a href="/chips">Chips</a></li>
-                <li><a href="/salt">Salt</a></li>
-                <li><a href="/vinegar">Vinegar</a></li>
-                <li>
-                  <a href="http://www.google.com" target="_blank">Google</a>
-                </li>
-                <li><a href="/fish">Fish</a></li>
-                <li><a href="/chips">Chips</a></li>
-                <li><a href="/salt">Salt</a></li>
-                <li><a href="/vinegar">Vinegar</a></li>
-                <li>
-                  <a href="http://www.google.com" target="_blank">Google</a>
-                </li>
-                <li><a href="/fish">Fish</a></li>
-                <li><a href="/chips">Chips</a></li>
-                <li><a href="/salt">Salt</a></li>
-                <li><a href="/vinegar">Vinegar</a></li>
-              </ul>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}
-
-export default Fourth;

src/pages/Second.jsx

@@ -1,117 +0,0 @@
-import { onMount, createSignal, For } from "solid-js"
-import { Scene, Marker, Popup } from '@antv/l7';
-// import { ProvinceLayer } from '@antv/l7-district';
-import { GaodeMap } from '@antv/l7-maps';
-
-import Laydate from "../components/laydate"
-
-// import config from "../base/config"
-
-import "../assets/style/Second.css"
-
-import Table from "../components/table";
-
-const [tab, setTab] = createSignal(0)
-
-
-async function mapChart() {
-    const scene = new Scene({
-        id: 'map1',
-        logoVisible: false,
-        map: new GaodeMap({
-            center: [108.2825, 36],
-            pitch: 30,
-            style: 'dark',
-            zoom: 6,
-            minZoom: 4,
-            maxZoom: 10
-        })
-    });
-    scene.on('loaded', () => {
-
-        const popup = new Popup({
-            offsets: [0, 20]
-        }).setText('hello');
-
-        const marker = new Marker()
-            .setLnglat([109, 35])
-            .setPopup(popup);
-
-        scene.addMarker(marker);
-        // new CountryLayer(scene, {
-        //     data: [
-        //         {
-        //             value: 1000
-        //         }
-        //     ],
-        //     depth: 1,
-        //     coastlineWidth: 0,
-        //     provinceStrokeWidth: 1,
-        //     provinceStroke: "#2999c0",
-        //     chinaNationalWidth: 1,
-        //     chinaNationalStroke: '#2b3a7c',
-        //     label: {
-        //         size: 14,
-        //         strokeWidth: 0,
-        //         stroke: 'rgba(0,0,0,0)',
-        //         color: "#fff"
-        //     },
-        //     fill: {
-        //         color: {
-        //             field: 'value',
-        //             values: ['rgba(43,58,124, .1)']
-        //         },
-        //         activeColor: false
-        //     },
-        //     popup: {
-        //         enable: false,
-        //     }
-        // });
-    });
-}
-
-function second() {
-    onMount(() => {
-        mapChart()
-    })
-    const tHead = [{ text: '发布时间', type: 'Text' }, { text: '信息来源', type: 'Text' }, { text: '信息标题', type: 'Text', flex: 2 }];
-    const tBody = [
-        {
-            color: "",
-            col: [
-                { text: '31分钟前', type: 'Text', color: "rgb(215 1 1 / 60%)", flex: 1 },
-                { text: '懂车帝', type: 'Text', color: "rgb(215 1 1 / 60%)", flex: 1 },
-                {
-                    flex: 2,
-                    text: '国足又输了 [流泪][流泪][流泪] 孔老二搬家 ……尽是书 说实话，怪不了这帮小子，他们尽力了，他们也就这能耐。 没有高考不行! 但是，高考为大众目标的教育，必然导致足球人口畸少而且素质极差。 此题',
-                    type: 'Scroll',
-                    color: "rgb(215 1 1 / 60%)"
-                }
-            ]
-        }
-    ]
-    return (
-        <div class="page SecondStyle">
-            <div class="SecondTitle">
-                <div class="T">
-                    <div class="STitle">舆论场态势实时感知</div>
-                </div>
-                <div class="B">
-                    <div class="row btnGroup">
-                        <For each={['全部热点', '行业热点']}>{(v, i) =>
-                            <div class={'col1 button ' + (tab() === i() ? 'select' : '')} tab={i()} onClick={() => setTab(i())}>{v}</div>
-                        }</For>
-                    </div>
-                    <Laydate width="13em" id="laydate" />
-                </div>
-            </div>
-
-            <Table localclass="secTableleft" head={tHead} body={tBody} />
-            <Table localclass="secTableright" head={tHead} body={tBody} />
-
-            <div id="map1"></div>
-        </div>
-    );
-}
-
-export default second;

src/pages/Third.jsx

@@ -1,332 +0,0 @@
-import { onMount, For, Switch, Match } from "solid-js"
-import { Chart } from '@antv/g2';
-import DataSet from '@antv/data-set';
-
-import ItemHead from "../components/itemHead";
-import Selsect from "../components/selsect";
-import Laydate from "../components/laydate"
-
-import "../assets/style/Third.css"
-
-let WordEle;
-
-function TrendChart() {
-  const data = [
-    { year: '1991', value: 15468, nagetiveValue: -15468, fraction: 0 },
-    { year: '1992', value: 16100, nagetiveValue: -16100, fraction: 0 },
-    { year: '1993', value: 15900, nagetiveValue: -15900, fraction: 0 },
-    { year: '1994', value: 17409, nagetiveValue: -17409, fraction: 20 },
-    { year: '1995', value: 17000, nagetiveValue: -17000, fraction: 20 },
-    { year: '1996', value: 31056, nagetiveValue: -31056, fraction: 20 },
-    { year: '1997', value: 31982, nagetiveValue: -31982, fraction: 20 },
-    { year: '1998', value: 32040, nagetiveValue: -32040, fraction: 20 },
-    { year: '1999', value: 33233, nagetiveValue: -33233, fraction: 20 },
-  ];
-  // 数据需要加工成 {year: '1996', type: 'north', value: 50} 的模式
-  const dv = new DataSet.DataView().source(data);
-  dv.transform({
-    type: 'fold',
-    fields: ['value', 'nagetiveValue', 'fraction'], // 展开字段集
-    key: 'type', // key字段
-    value: 'value', // value字段
-  });
-  const chart = new Chart({
-    container: 'Trend',
-    autoFit: true,
-    height: WordEle.offsetHeight,
-    renderer: 'svg',
-    padding: [20, 50, 30, 50],
-  });
-
-  chart.data(dv.rows);
-  chart.scale({
-    value: {
-      nice: true,
-    },
-    year: {
-      range: [0, 1],
-    },
-    fraction: {
-      nice: true,
-    }
-  });
-
-  chart.axis('rain', {
-    grid: null,
-    title: {},
-  });
-  chart.axis('flow', {
-    title: {},
-  });
-  chart.tooltip({
-    showCrosshairs: true,
-    shared: true,
-    marker: {
-      fill: "#ddd"
-    },
-    customItems: (items) => {
-      for (let i = 0; i < items.length; i++) {
-        const v = items[i];
-        v.name = v.name === 'value' ? '非负面' : '负面'
-
-      }
-      return items;
-    },
-  });
-
-  chart.axis('value', {
-    label: {
-      formatter: (val) => {
-        return (val / 1000).toFixed(1) + 'k';
-      },
-    },
-  });
-
-  chart.area().position('year*value').color('type', ['#34643d', '#dd0303']).shape('smooth');
-  chart.line().position('year*value').color('type', ['#34643d', '#dd0303']).shape('smooth');
-
-  chart.render();
-}
-
-function HistoryListComponent(props) {
-  return <div class="historylist">
-    <div class="row">
-      <div class="col5">
-        <div class="listName">
-          <span class={'sortNum ' + (props.i < 4 ? 'sortNumBG' : '')}>{props.i}</span>
-          {props.item.title}
-        </div>
-      </div>
-      <div class="col2 listName" style={{"text-align":"right"}}>
-        <Switch fallback={<div>风险度：<span style={{"color":"green"}}>{props.item.risk}</span></div>}>
-          <Match when={props.item.risk > 40}>
-            风险度：<span style={{"color":"red"}}>{props.item.risk}</span>
-          </Match>
-        </Switch>
-      </div>
-    </div>
-    <div style={{"text-align":"right","padding-right":"5px","font-size":".1rem"}}>
-      {props.item.date}
-      <img src="/src/assets/img/zz.png" style={{"width":"2.5em","margin-left":"5px"}} alt="" />
-    </div>
-  </div>
-}
-
-function RealTimeListComponent(props) {
-  return <div class="row">
-    <div class="col1 realTime">
-      <div class="text listName">{props.item.date.replace(/-/g, '/')}</div>
-      <div class="circular"></div>
-    </div>
-    <div class="col1 historylist border-right">
-      <div class="row">
-        <div class="col5">
-          <div class="listName">
-            {props.item.title}
-          </div>
-        </div>
-      </div>
-      <div style={{"text-align":"right","padding-right":"5px","font-size":".1rem"}}>
-        <div class="col2 listName" style={{"text-align":"right"}}>
-          <Switch fallback={<div>风险度：<span style={{"color":"green"}}>{props.item.risk}</span></div>}>
-            <Match when={props.item.risk > 40}>
-              风险度：<span style={{"color":"red"}}>{props.item.risk}</span>
-            </Match>
-          </Switch>
-        </div>
-      </div>
-    </div>
-  </div>
-}
-
-function FuncClassItemComponent() {
-  return <div class="funcClassItem">
-    <div class="row">
-      <div class="col4">十四运</div>
-      <div class="col1">2</div>
-    </div>
-    <div class="row">
-      <div class="col1">
-        0 <p>风险度</p>
-      </div>
-      <div class="col2">
-        <div class="row">
-          <div class="col1">0 <p>重视度</p></div>
-          <div class="col1">0 <p>敏感度</p></div>
-        </div>
-        <div class="row">
-          <div class="col1">0 <p>传播度</p></div>
-          <div class="col1">0 <p>关注度</p></div>
-        </div>
-      </div>
-    </div>
-  </div>
-}
-
-function SwiperFuncClassComponent() {
-  onMount(() => {
-    new window.Swiper('.swiper-container2', {
-      pagination: '.swiper-pagination',
-      slidesPerView: 3,
-      slidesPerColumn: 2,
-      paginationClickable: true,
-      spaceBetween: 30,
-    });
-  })
-
-  return <div class="chart3 swiper-container swiper-container2">
-    <div class="swiper-wrapper">
-      <div class="swiper-slide">
-        <FuncClassItemComponent />
-      </div>
-      <div class="swiper-slide">
-        <FuncClassItemComponent />
-      </div>
-      <div class="swiper-slide">
-        <FuncClassItemComponent />
-      </div>
-      <div class="swiper-slide">
-        <FuncClassItemComponent />
-      </div>
-      <div class="swiper-slide">
-        <FuncClassItemComponent />
-      </div>
-      <div class="swiper-slide">
-        <FuncClassItemComponent />
-      </div>
-      <div class="swiper-slide">
-        <FuncClassItemComponent />
-      </div>
-      <div class="swiper-slide">
-        <FuncClassItemComponent />
-      </div>
-    </div>
-    {/* Add Pagination */}
-    <div class="swiper-pagination"></div>
-  </div>
-}
-
-function TrackFunc() {
-  onMount(() => {
-    new window.Swiper(".swiper-container1", {
-      effect: "coverflow",
-      pagination: '.swiper-pagination',
-      grabCursor: true,
-      centeredSlides: true,
-      slidesPerView: "auto",
-      coverflowEffect: {
-        rotate: 50,
-        stretch: 0,
-        depth: 100,
-        modifier: 1,
-        slideShadows: true,
-      }
-    });
-  })
-
-  return <div class="chart3 swiper-container swiper-container1">
-    <div class="swiper-wrapper">
-      <div class="swiper-slide">
-        1
-      </div>
-      <div class="swiper-slide">
-        2
-      </div>
-    </div>
-    {/* Add Pagination */}
-    <div class="swiper-pagination"></div>
-  </div>
-}
-
-function third() {
-  onMount(() => {
-    TrendChart()
-  })
-
-  const list = [
-    {
-      code: 0,
-      name: "这是啥"
-    },
-    {
-      code: 0,
-      name: "这是啥2"
-    },
-    {
-      code: 0,
-      name: "这是啥3"
-    }
-  ]
-
-  const historyData = [
-    {
-      title: "台湾高雄一12层建筑凌晨突发大火",
-      risk: 0,
-      date: "2021-10-12  00:00"
-    },
-    {
-      title: "台湾高雄一12层建筑凌晨突发大火",
-      risk: 0,
-      date: "2021-10-12  01:00"
-    },
-    {
-      title: "台湾高雄一12层建筑凌晨突发大火",
-      risk: 0,
-      date: "2021-10-12  01:00"
-    },
-    {
-      title: "台湾高雄一12层建筑凌晨突发大火",
-      risk: 0,
-      date: "2021-10-12  01:00"
-    }
-  ]
-
-  return (
-    <div class="page">
-      <div class="row height50 ThirdLayourt">
-        <div class="col2">
-          <ItemHead title="追踪事件" subtitle="Tracking Event" />
-          <TrackFunc />
-        </div>
-        <div class="col3" ref={WordEle}>
-          <div class="chart3" id="Trend"></div>
-        </div>
-      </div>
-      <div class="row height50 ThirdLayourt">
-        <div class="col1">
-          <ItemHead title="实时预警" subtitle="RealTime Warning" />
-          <div class="chart3" style={{"overflow-y":"scroll","height":"calc(100% - 64px)"}}>
-            <For each={historyData}>
-              {(item, i) => (
-                <RealTimeListComponent item={item} i={i() + 1} />
-              )}
-            </For>
-          </div>
-        </div>
-        <div class="col1 layout">
-          <div class="datetime">
-            <Laydate width="13em" id="laydate" />
-          </div>
-          <ItemHead title="历史事件榜" noimg={true} subtitle="History EventList" />
-          <div class="chart3" style={{"overflow-y":"scroll","height":"calc(100% - 64px)"}}>
-            <For each={historyData}>
-              {(item, i) => (
-                <HistoryListComponent item={item} i={i() + 1} />
-              )}
-            </For>
-          </div>
-        </div>
-        <div class="col3 layout">
-          <div class="datetime">
-            <Selsect title="123" list={list} />
-            <Selsect title="123" list={list} />
-          </div>
-          <ItemHead title="事件库" subtitle="Event Library " />
-          <SwiperFuncClassComponent />
-        </div>
-      </div>
-    </div>
-  );
-}
-
-export default third;

src/pages/bigScreen/Home.jsx

@@ -32,138 +32,7 @@ function setTQ(TQ) {
 }
 
 function BigScreenHome() {
-    const [HeadTitle, setHeadTitle] = createSignal([
-        {
-            title: "传统媒体-覆盖终端",
-            path: [
-                {
-                    d: "M858.5 763.6c-18.9-44.8-46.1-85-80.6-119.5-34.5-34.5-74.7-61.6-119.5-80.6-0.4-0.2-0.8-0.3-1.2-0.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-0.4 0.2-0.8 0.3-1.2 0.5-44.8 18.9-85 46-119.5 80.6-34.5 34.5-61.6 74.7-80.6 119.5C146.9 807.5 137 854 136 901.8c-0.1 4.5 3.5 8.2 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c0.1 4.4 3.6 7.8 8 7.8h60c4.5 0 8.1-3.7 8-8.2-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z",
-                    color: "#02ffec"
-                }
-            ]
-        },
-        {
-            title: "传统媒体-日活跃用户",
-            path: [
-                {
-                    d: "M512.000512 64.909335c-246.926856 0-447.090665 200.158692-447.090665 447.088618 0 246.935042 200.163809 447.090665 447.090665 447.090665 246.935042 0 447.087595-200.158692 447.087595-447.090665C959.088106 265.068028 758.933507 64.909335 512.000512 64.909335zM512.000512 899.476939c-213.646891 0-387.478985-173.828001-387.478985-387.476939 0-213.646891 173.832094-387.475915 387.478985-387.475915 213.647915 0 387.474892 173.830047 387.474892 387.475915C899.476427 725.646891 725.648426 899.476939 512.000512 899.476939z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M159.919734 484.371756l55.255465 0 0 55.256488-55.255465 0 0-55.256488Z",
-                    color: "#02f5e2"
-                },
-                {
-                    d: "M807.639812 484.370733l55.256488 0 0 55.256488-55.256488 0 0-55.256488Z",
-                    color: "#02f5e2"
-                },
-                {
-                    d: "M484.370221 164.528194l55.256488 0 0 55.256488-55.256488 0 0-55.256488Z",
-                    color: "#02f5e2"
-                },
-                {
-                    d: "M484.370221 253.55174l55.256488 0 0 286.079574-55.256488 0 0-286.079574Z",
-                    color: "#02f5e2"
-                },
-                {
-                    d: "M682.960649 660.67276l-39.071863 39.071863-159.509552-159.509552 39.071863-39.071863 159.509552 159.509552Z",
-                    color: "#02f5e2"
-                },
-                {
-                    d: "M484.371244 802.527886l55.256488 0 0 55.256488-55.256488 0 0-55.256488Z",
-                    color: "#02f5e2"
-                }
-            ]
-        },
-        {
-            title: "传统媒体-日收视次数",
-            path: [
-                {
-                    d: "M682.666667 853.333333H213.333333V213.333333h469.333334v256h170.666666v384h-170.666666z m0-42.666666h128v-298.666667h-128v298.666667z m-42.666667-298.666667V256H256v554.666667h384v-298.666667zM341.333333 384V298.666667h42.666667v85.333333H341.333333z m85.333334 0V298.666667h42.666666v85.333333h-42.666666z m-85.333334 128v-85.333333h42.666667v85.333333H341.333333z m85.333334 0v-85.333333h42.666666v85.333333h-42.666666z m-85.333334 128v-85.333333h42.666667v85.333333H341.333333z m85.333334 0v-85.333333h42.666666v85.333333h-42.666666z m-85.333334 128v-85.333333h42.666667v85.333333H341.333333z m85.333334 0v-85.333333h42.666666v85.333333h-42.666666z m85.333333-384V298.666667h42.666667v85.333333h-42.666667z m0 128v-85.333333h42.666667v85.333333h-42.666667z m0 128v-85.333333h42.666667v85.333333h-42.666667z m0 128v-85.333333h42.666667v85.333333h-42.666667z m213.333333-170.666667v-42.666666h42.666667v42.666666h-42.666667z m0 85.333334v-42.666667h42.666667v42.666667h-42.666667z m0 85.333333v-42.666667h42.666667v42.666667h-42.666667z",
-                    color: "#02ffec"
-                }
-            ]
-        },
-        {
-            title: "传统媒体-昨日收视时长",
-            path: [
-                {
-                    d: 'M920.900621 803.267543 112.32753 803.267543c-49.059901 0-88.982874-39.921757-88.982874-88.982874L23.344655 172.240573c0-49.07328 39.922973-88.996254 88.982874-88.996254l808.573091 0c49.061117 0 88.981658 39.922973 88.981658 88.996254l0 542.044096C1009.882279 763.345786 969.961738 803.267543 920.900621 803.267543zM112.32753 104.039587c-37.593738 0-68.188823 30.595085-68.188823 68.202202l0 542.044096c0 37.594954 30.595085 68.190039 68.188823 68.190039l808.573091 0c37.592522 0 68.190039-30.593869 68.190039-68.190039L989.09066 172.240573c0-37.605901-30.596301-68.202202-68.190039-68.202202L112.32753 104.038371z',
-                    color: "#02ffec"
-                },
-                {
-                    d: 'M908.227878 636.659706 124.997841 636.659706 124.997841 163.603549l783.230037 0L908.227878 636.659706zM145.791892 615.866871l741.643151 0L887.435043 184.397601 145.791892 184.397601 145.791892 615.866871z',
-                    color: "#02ffec"
-                },
-                {
-                    d: "M516.613467 943.368317c-5.740988 0-10.397026-4.657255-10.397026-10.397026l0-109.736787c0-5.739771 4.656038-10.394593 10.397026-10.394593 5.739771 0 10.397026 4.654822 10.397026 10.394593l0 109.736787C527.010493 938.711062 522.353239 943.368317 516.613467 943.368317z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M682.963447 943.368317 350.263488 943.368317c-5.739771 0-10.397026-4.657255-10.397026-10.397026 0-5.738555 4.657255-10.395809 10.397026-10.395809l332.699958 0c5.739771 0 10.397026 4.657255 10.397026 10.395809C693.360472 938.711062 688.703218 943.368317 682.963447 943.368317z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M608.966739 494.002247c-2.66737 0-5.320144-1.01562-7.350167-3.046859-4.062478-4.061262-4.062478-10.640288 0-14.70155l168.08079-168.082006c4.061262-4.061262 10.641504-4.061262 14.70155 0 4.062478 4.062478 4.062478 10.641504 0 14.702766L616.318122 490.955388C614.285667 492.986628 611.632893 494.002247 608.966739 494.002247z",
-                    color: "#02ffec"
-                },
-                {
-                    d: 'M270.486871 470.89234c-2.66737 0-5.32136-1.01562-7.350167-3.044426-4.062478-4.062478-4.062478-10.640288 0-14.703983l110.899581-110.899581c4.061262-4.060046 10.640288-4.060046 14.70155 0 4.061262 4.063695 4.061262 10.641504 0 14.703983l-110.899581 110.899581C275.807015 469.87672 273.153025 470.89234 270.486871 470.89234z',
-                    color: "#02ffec"
-                },
-                {
-                    d: 'M270.486871 470.89234c-2.66737 0-5.32136-1.01562-7.350167-3.044426-4.062478-4.062478-4.062478-10.640288 0-14.703983l110.899581-110.899581c4.061262-4.060046 10.640288-4.060046 14.70155 0 4.061262 4.063695 4.061262 10.641504 0 14.703983l-110.899581 110.899581C275.807015 469.87672 273.153025 470.89234 270.486871 470.89234z',
-                    color: "#02ffec"
-                },
-                {
-                    d: "M259.225048 478.982024c0 9.090708-7.365979 16.462768-16.462768 16.462768-9.08341 0-16.461552-7.37206-16.461552-16.462768 0-9.089492 7.378142-16.462768 16.461552-16.462768C251.857853 462.519255 259.225048 469.892532 259.225048 478.982024z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M417.776042 331.984768c0 9.090708-7.363546 16.461552-16.461552 16.461552-9.084626 0-16.462768-7.370844-16.462768-16.461552 0-9.098006 7.376926-16.462768 16.462768-16.462768C410.411279 315.521999 417.776042 322.886762 417.776042 331.984768z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M597.122303 505.839385c0 9.09314-7.364763 16.462768-16.462768 16.462768-9.08341 0-16.460336-7.370844-16.460336-16.462768 0-9.089492 7.376926-16.460336 16.460336-16.460336C589.757541 489.37905 597.122303 496.749894 597.122303 505.839385z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M533.075019 704.246455c0 9.090708-7.364763 16.462768-16.461552 16.462768-9.084626 0-16.462768-7.373277-16.462768-16.462768 0-9.089492 7.378142-16.462768 16.462768-16.462768C525.711473 687.783687 533.075019 695.156963 533.075019 704.246455z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M813.721736 293.571236c0 9.090708-7.36233 16.462768-16.459119 16.462768-9.084626 0-16.462768-7.37206-16.462768-16.462768 0-9.089492 7.378142-16.461552 16.462768-16.461552C806.359406 277.109684 813.721736 284.481745 813.721736 293.571236z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M552.934944 494.002247c-2.706292 0-5.40042-1.042378-7.443823-3.140515L414.66107 356.852244c-4.006528-4.100184-3.926252-10.680426 0.189745-14.700334 4.102617-3.978553 10.680426-3.954227 14.70155 0.190961l130.826402 134.007056c4.007744 4.102617 3.927468 10.681642-0.188528 14.703983C558.173595 493.013387 555.562176 494.002247 552.934944 494.002247z",
-                    color: "#02ffec"
-                }
-            ]
-        },
-        {
-            title: "新媒体月度传播力",
-            path: [
-                {
-                    d: "M294.4 684.032c-95.232 0-174.592-79.36-174.592-174.592s79.36-174.592 174.592-174.592 174.592 79.36 174.592 174.592-78.848 174.592-174.592 174.592z m0-293.376c-65.024 0-118.784 53.76-118.784 118.784s53.76 118.784 118.784 118.784 118.784-53.76 118.784-118.784-53.248-118.784-118.784-118.784zM732.672 1013.248c-86.016 0-156.16-69.632-156.16-156.16s69.632-156.16 156.16-156.16 156.16 69.632 156.16 156.16-70.144 156.16-156.16 156.16z m0-256c-55.808 0-99.84 44.032-99.84 99.84s44.032 99.84 99.84 99.84 99.84-44.032 99.84-99.84-44.032-99.84-99.84-99.84zM667.136 291.84c-79.36 0-141.824-62.976-141.824-141.824s62.976-141.824 141.824-141.824S808.96 71.168 808.96 150.016 745.984 291.84 667.136 291.84z m0-227.84c-46.592 0-86.016 39.424-86.016 86.016s39.424 86.016 86.016 86.016 86.016-39.424 86.016-86.016-39.424-86.016-86.016-86.016z",
-                    color: "#02ffec"
-                },
-                {
-                    d: "M573.44 259.072L401.408 398.848c-11.776 9.216-30.208 7.168-39.424-4.608l-2.56-2.56c-9.216-11.776-7.168-30.208 4.608-39.424l172.032-139.776c11.776-9.216 30.208-7.168 39.424 4.608l2.56 2.56c9.216 13.824 7.168 30.208-4.608 39.424zM588.288 785.408l-177.152-134.144c-13.312-10.24-14.336-26.624-6.656-39.936l2.56-2.048c10.24-13.312 26.624-14.336 39.936-6.656l177.152 134.144c13.312 10.24 14.336 26.624 6.656 39.936l-2.56 2.048c-10.24 13.824-27.136 17.408-39.936 6.656z",
-                    color: "#02ffec"
-                }
-            ]
-        },
-        {
-            title: "重大活动传播总量",
-            path: [
-                {
-                    d: "M910.4 0H115.2C52.8 0 1.6 51.2 1.6 113.6v793.6c0 62.4 51.2 113.6 113.6 113.6h793.6c62.4 0 113.6-51.2 113.6-113.6V113.6C1024 51.2 972.8 0 910.4 0z m-568 795.2H228.8V396.8h113.6v398.4z m227.2 0H456v-568h113.6v568z m227.2 0H683.2V568h113.6v227.2z",
-                    color: "#02ffec"
-                }
-            ]
-        }
-    ]);
+    const [HeadTitle, setHeadTitle] = createSignal();
     const [proTv, setproTv] = createSignal([
         {
             text: "陕台频道收视率",
@@ -187,24 +56,160 @@ function BigScreenHome() {
         getWeather().then(r => setTQ(r.data))
         getData().then(r => {
             if (r.code != 0) return
-            const newHeadTitle = [], newproTv = proTv(), HeadTitleData = HeadTitle(), d = r.data || {};
-            console.log('-')
-            for (let i = 0; i < HeadTitleData.length; i++) {
-                const v = HeadTitleData[i];
-                if (v.title === '重大活动传播总量') v.value = d.activity_total.data
-                else if (v.title === "新媒体月度传播力") v.value = d.media_month_play.data
-                else if (v.title === "传统媒体-昨日收视时长") v.value = (d.media_overview.data.timeCount / 60).toFixed(0)
-                else if (v.title === "传统媒体-日收视次数") v.value = d.media_overview.data.watchCount
-                else if (v.title === "传统媒体-日活跃用户") v.value = d.media_overview.data.activeUser
-                else if (v.title === "传统媒体-覆盖终端") v.value = d.media_overview.data.totalUser
-                newHeadTitle.push(v)
-            }
-            newproTv[0].value = d.cm_tv_overview.data.watchRate;
-            newproTv[1].value = d.cm_tv_overview.data.occRate;
-            newproTv[2].value = d.cm_tv_overview.data.loyalty;
+            const d = r.data || {};
             setoriData(d || {})
-            setHeadTitle(newHeadTitle)
-            setproTv(newproTv)
+            setHeadTitle([
+                {
+                    title: "传统媒体-覆盖终端",
+                    value: d.media_overview.data.totalUser,
+                    path: [
+                        {
+                            d: "M858.5 763.6c-18.9-44.8-46.1-85-80.6-119.5-34.5-34.5-74.7-61.6-119.5-80.6-0.4-0.2-0.8-0.3-1.2-0.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-0.4 0.2-0.8 0.3-1.2 0.5-44.8 18.9-85 46-119.5 80.6-34.5 34.5-61.6 74.7-80.6 119.5C146.9 807.5 137 854 136 901.8c-0.1 4.5 3.5 8.2 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c0.1 4.4 3.6 7.8 8 7.8h60c4.5 0 8.1-3.7 8-8.2-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z",
+                            color: "#02ffec"
+                        }
+                    ]
+                },
+                {
+                    title: "传统媒体-日活跃用户",
+                    value: d.media_overview.data.activeUser,
+                    path: [
+                        {
+                            d: "M512.000512 64.909335c-246.926856 0-447.090665 200.158692-447.090665 447.088618 0 246.935042 200.163809 447.090665 447.090665 447.090665 246.935042 0 447.087595-200.158692 447.087595-447.090665C959.088106 265.068028 758.933507 64.909335 512.000512 64.909335zM512.000512 899.476939c-213.646891 0-387.478985-173.828001-387.478985-387.476939 0-213.646891 173.832094-387.475915 387.478985-387.475915 213.647915 0 387.474892 173.830047 387.474892 387.475915C899.476427 725.646891 725.648426 899.476939 512.000512 899.476939z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M159.919734 484.371756l55.255465 0 0 55.256488-55.255465 0 0-55.256488Z",
+                            color: "#02f5e2"
+                        },
+                        {
+                            d: "M807.639812 484.370733l55.256488 0 0 55.256488-55.256488 0 0-55.256488Z",
+                            color: "#02f5e2"
+                        },
+                        {
+                            d: "M484.370221 164.528194l55.256488 0 0 55.256488-55.256488 0 0-55.256488Z",
+                            color: "#02f5e2"
+                        },
+                        {
+                            d: "M484.370221 253.55174l55.256488 0 0 286.079574-55.256488 0 0-286.079574Z",
+                            color: "#02f5e2"
+                        },
+                        {
+                            d: "M682.960649 660.67276l-39.071863 39.071863-159.509552-159.509552 39.071863-39.071863 159.509552 159.509552Z",
+                            color: "#02f5e2"
+                        },
+                        {
+                            d: "M484.371244 802.527886l55.256488 0 0 55.256488-55.256488 0 0-55.256488Z",
+                            color: "#02f5e2"
+                        }
+                    ]
+                },
+                {
+                    title: "传统媒体-日收视次数",
+                    value: d.media_overview.data.watchCount,
+                    path: [
+                        {
+                            d: "M682.666667 853.333333H213.333333V213.333333h469.333334v256h170.666666v384h-170.666666z m0-42.666666h128v-298.666667h-128v298.666667z m-42.666667-298.666667V256H256v554.666667h384v-298.666667zM341.333333 384V298.666667h42.666667v85.333333H341.333333z m85.333334 0V298.666667h42.666666v85.333333h-42.666666z m-85.333334 128v-85.333333h42.666667v85.333333H341.333333z m85.333334 0v-85.333333h42.666666v85.333333h-42.666666z m-85.333334 128v-85.333333h42.666667v85.333333H341.333333z m85.333334 0v-85.333333h42.666666v85.333333h-42.666666z m-85.333334 128v-85.333333h42.666667v85.333333H341.333333z m85.333334 0v-85.333333h42.666666v85.333333h-42.666666z m85.333333-384V298.666667h42.666667v85.333333h-42.666667z m0 128v-85.333333h42.666667v85.333333h-42.666667z m0 128v-85.333333h42.666667v85.333333h-42.666667z m0 128v-85.333333h42.666667v85.333333h-42.666667z m213.333333-170.666667v-42.666666h42.666667v42.666666h-42.666667z m0 85.333334v-42.666667h42.666667v42.666667h-42.666667z m0 85.333333v-42.666667h42.666667v42.666667h-42.666667z",
+                            color: "#02ffec"
+                        }
+                    ]
+                },
+                {
+                    title: "传统媒体-昨日收视时长",
+                    value: (d.media_overview.data.timeCount / 60).toFixed(0),
+                    path: [
+                        {
+                            d: 'M920.900621 803.267543 112.32753 803.267543c-49.059901 0-88.982874-39.921757-88.982874-88.982874L23.344655 172.240573c0-49.07328 39.922973-88.996254 88.982874-88.996254l808.573091 0c49.061117 0 88.981658 39.922973 88.981658 88.996254l0 542.044096C1009.882279 763.345786 969.961738 803.267543 920.900621 803.267543zM112.32753 104.039587c-37.593738 0-68.188823 30.595085-68.188823 68.202202l0 542.044096c0 37.594954 30.595085 68.190039 68.188823 68.190039l808.573091 0c37.592522 0 68.190039-30.593869 68.190039-68.190039L989.09066 172.240573c0-37.605901-30.596301-68.202202-68.190039-68.202202L112.32753 104.038371z',
+                            color: "#02ffec"
+                        },
+                        {
+                            d: 'M908.227878 636.659706 124.997841 636.659706 124.997841 163.603549l783.230037 0L908.227878 636.659706zM145.791892 615.866871l741.643151 0L887.435043 184.397601 145.791892 184.397601 145.791892 615.866871z',
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M516.613467 943.368317c-5.740988 0-10.397026-4.657255-10.397026-10.397026l0-109.736787c0-5.739771 4.656038-10.394593 10.397026-10.394593 5.739771 0 10.397026 4.654822 10.397026 10.394593l0 109.736787C527.010493 938.711062 522.353239 943.368317 516.613467 943.368317z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M682.963447 943.368317 350.263488 943.368317c-5.739771 0-10.397026-4.657255-10.397026-10.397026 0-5.738555 4.657255-10.395809 10.397026-10.395809l332.699958 0c5.739771 0 10.397026 4.657255 10.397026 10.395809C693.360472 938.711062 688.703218 943.368317 682.963447 943.368317z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M608.966739 494.002247c-2.66737 0-5.320144-1.01562-7.350167-3.046859-4.062478-4.061262-4.062478-10.640288 0-14.70155l168.08079-168.082006c4.061262-4.061262 10.641504-4.061262 14.70155 0 4.062478 4.062478 4.062478 10.641504 0 14.702766L616.318122 490.955388C614.285667 492.986628 611.632893 494.002247 608.966739 494.002247z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: 'M270.486871 470.89234c-2.66737 0-5.32136-1.01562-7.350167-3.044426-4.062478-4.062478-4.062478-10.640288 0-14.703983l110.899581-110.899581c4.061262-4.060046 10.640288-4.060046 14.70155 0 4.061262 4.063695 4.061262 10.641504 0 14.703983l-110.899581 110.899581C275.807015 469.87672 273.153025 470.89234 270.486871 470.89234z',
+                            color: "#02ffec"
+                        },
+                        {
+                            d: 'M270.486871 470.89234c-2.66737 0-5.32136-1.01562-7.350167-3.044426-4.062478-4.062478-4.062478-10.640288 0-14.703983l110.899581-110.899581c4.061262-4.060046 10.640288-4.060046 14.70155 0 4.061262 4.063695 4.061262 10.641504 0 14.703983l-110.899581 110.899581C275.807015 469.87672 273.153025 470.89234 270.486871 470.89234z',
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M259.225048 478.982024c0 9.090708-7.365979 16.462768-16.462768 16.462768-9.08341 0-16.461552-7.37206-16.461552-16.462768 0-9.089492 7.378142-16.462768 16.461552-16.462768C251.857853 462.519255 259.225048 469.892532 259.225048 478.982024z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M417.776042 331.984768c0 9.090708-7.363546 16.461552-16.461552 16.461552-9.084626 0-16.462768-7.370844-16.462768-16.461552 0-9.098006 7.376926-16.462768 16.462768-16.462768C410.411279 315.521999 417.776042 322.886762 417.776042 331.984768z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M597.122303 505.839385c0 9.09314-7.364763 16.462768-16.462768 16.462768-9.08341 0-16.460336-7.370844-16.460336-16.462768 0-9.089492 7.376926-16.460336 16.460336-16.460336C589.757541 489.37905 597.122303 496.749894 597.122303 505.839385z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M533.075019 704.246455c0 9.090708-7.364763 16.462768-16.461552 16.462768-9.084626 0-16.462768-7.373277-16.462768-16.462768 0-9.089492 7.378142-16.462768 16.462768-16.462768C525.711473 687.783687 533.075019 695.156963 533.075019 704.246455z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M813.721736 293.571236c0 9.090708-7.36233 16.462768-16.459119 16.462768-9.084626 0-16.462768-7.37206-16.462768-16.462768 0-9.089492 7.378142-16.461552 16.462768-16.461552C806.359406 277.109684 813.721736 284.481745 813.721736 293.571236z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M552.934944 494.002247c-2.706292 0-5.40042-1.042378-7.443823-3.140515L414.66107 356.852244c-4.006528-4.100184-3.926252-10.680426 0.189745-14.700334 4.102617-3.978553 10.680426-3.954227 14.70155 0.190961l130.826402 134.007056c4.007744 4.102617 3.927468 10.681642-0.188528 14.703983C558.173595 493.013387 555.562176 494.002247 552.934944 494.002247z",
+                            color: "#02ffec"
+                        }
+                    ]
+                },
+                {
+                    title: "新媒体月度传播力",
+                    value: d.media_month_play.data,
+                    path: [
+                        {
+                            d: "M294.4 684.032c-95.232 0-174.592-79.36-174.592-174.592s79.36-174.592 174.592-174.592 174.592 79.36 174.592 174.592-78.848 174.592-174.592 174.592z m0-293.376c-65.024 0-118.784 53.76-118.784 118.784s53.76 118.784 118.784 118.784 118.784-53.76 118.784-118.784-53.248-118.784-118.784-118.784zM732.672 1013.248c-86.016 0-156.16-69.632-156.16-156.16s69.632-156.16 156.16-156.16 156.16 69.632 156.16 156.16-70.144 156.16-156.16 156.16z m0-256c-55.808 0-99.84 44.032-99.84 99.84s44.032 99.84 99.84 99.84 99.84-44.032 99.84-99.84-44.032-99.84-99.84-99.84zM667.136 291.84c-79.36 0-141.824-62.976-141.824-141.824s62.976-141.824 141.824-141.824S808.96 71.168 808.96 150.016 745.984 291.84 667.136 291.84z m0-227.84c-46.592 0-86.016 39.424-86.016 86.016s39.424 86.016 86.016 86.016 86.016-39.424 86.016-86.016-39.424-86.016-86.016-86.016z",
+                            color: "#02ffec"
+                        },
+                        {
+                            d: "M573.44 259.072L401.408 398.848c-11.776 9.216-30.208 7.168-39.424-4.608l-2.56-2.56c-9.216-11.776-7.168-30.208 4.608-39.424l172.032-139.776c11.776-9.216 30.208-7.168 39.424 4.608l2.56 2.56c9.216 13.824 7.168 30.208-4.608 39.424zM588.288 785.408l-177.152-134.144c-13.312-10.24-14.336-26.624-6.656-39.936l2.56-2.048c10.24-13.312 26.624-14.336 39.936-6.656l177.152 134.144c13.312 10.24 14.336 26.624 6.656 39.936l-2.56 2.048c-10.24 13.824-27.136 17.408-39.936 6.656z",
+                            color: "#02ffec"
+                        }
+                    ]
+                },
+                {
+                    title: "重大活动传播总量",
+                    value: d.activity_total.data,
+                    path: [
+                        {
+                            d: "M910.4 0H115.2C52.8 0 1.6 51.2 1.6 113.6v793.6c0 62.4 51.2 113.6 113.6 113.6h793.6c62.4 0 113.6-51.2 113.6-113.6V113.6C1024 51.2 972.8 0 910.4 0z m-568 795.2H228.8V396.8h113.6v398.4z m227.2 0H456v-568h113.6v568z m227.2 0H683.2V568h113.6v227.2z",
+                            color: "#02ffec"
+                        }
+                    ]
+                }
+            ])
+            setproTv([
+                {
+                    text: "陕台频道收视率",
+                    value: d.cm_tv_overview.data.watchRate
+                },
+                {
+                    text: "陕台频道忠诚度",
+                    value: d.cm_tv_overview.data.occRate
+                },
+                {
+                    text: "陕台频道市场份额",
+                    value: d.cm_tv_overview.data.loyalty
+                },
+            ])
         })
         // TODO: 浏览器获取定位权限
         // const location = navigator.geolocation || false;
@@ -227,7 +232,7 @@ function BigScreenHome() {
             <div class="homeHeader">
                 <div class="sz">
                     <img style={{ "vertical-align": 'middle', width: '115px' }}
-                        src="http://res.cnwest.com/t/site/10001/663789250d35fb30006597dcddc4be8b/assets/sxtvs2019/sxtvs_index/images/logonew2.png" alt="" />
+                        src="https://cxzx.smcic.net/topic/tool/img/jtlogo.png" alt="" />
                     <span style={{ "vertical-align": 'middle' }}>
                         {TimeDate()}
                     </span>

src/pages/bigScreen/components/Map-l7.jsx

@@ -4,7 +4,7 @@ import { Mapbox } from '@antv/l7-maps';
 // import { GaodeMap } from '@antv/l7-maps';
 // import DataSet from '@antv/data-set';
 
-import json from "../../../assets/file/100000_full.json"
+// import json from "../../../assets/file/100000_full.json"
 
 import utils from "../../../utils/index"
 // import config from "../../../base/config"
@@ -13,6 +13,7 @@ import { getMapfull } from "../../../api/bigScreen"
 
 import "../../../assets/style/BigScreenHome.css"
 
+let total = 0
 
 function Map(prop) {
     let anchorLayer = undefined,
@@ -68,11 +69,11 @@ function Map(prop) {
             //     token: config.gaodeToken
             // })
             map: new Mapbox({
-                pitch: 80,
-                center: [108.2, 35],
+                pitch: 0,
+                center: [108.2, 35.6],
                 style: 'blank',
-                zoom: 5.6,
-                minZoom: 5.6,
+                zoom: 5.4,
+                minZoom: 5.4,
             })
         });
         scene.setMapStatus({ dragEnable: false });
@@ -90,11 +91,13 @@ function Map(prop) {
                 li = data && data.features && data.features.length ? data.features : [];
                 for (let i = 0; i < li.length; i++) {
                     const v = li[i].properties || { center: [] };
+                    const size = prop.li.find(item => item.area === v.name).usrcount
+                    total += size;
                     const Data = {
                         name: v.name,
                         lng: v.center[0],
                         lat: v.center[1],
-                        size: prop.li.find(item => item.area === v.name).usrcount, // 自定义数据
+                        size // 自定义数据
                     };
                     source.push(Data);
                 }
@@ -116,7 +119,7 @@ function Map(prop) {
                     .color('rgb(0,255,255)')
                     .size(0.5)
                     .style({
-                        raisingHeight: 150000,
+                        raisingHeight: 0,
                         opacity: 0.8,
                     })
                     .animate({
@@ -125,20 +128,20 @@ function Map(prop) {
                         trailLength: 3 // 流线长度
                     });
                 //  围栏
-                const bottomLayer = new LineLayer({ zIndex: 0, blend: "normal" })
-                    .source(json)
-                    .shape('wall')
-                    .color('rgb(255,255,255)')
-                    .size(10)
-                    .style({
-                        heightfixed: true,
-                        opacity: 1,
-                        sourceColor: '#0DCCFF',
-                    });
+                // const bottomLayer = new LineLayer({ zIndex: 0, blend: "normal" })
+                //     .source(json)
+                //     .shape('wall')
+                //     .color('rgb(255,255,255)')
+                //     .size(10)
+                //     .style({
+                //         heightfixed: true,
+                //         opacity: 1,
+                //         sourceColor: '#0DCCFF',
+                //     });
                 // 高度
                 const gd = new PolygonLayer({ zIndex: 1, blend: "normal" })
                     .source(data)
-                    .size(150000)
+                    .size(1)
                     .shape('extrude')
                     .color("#3194fb")
                     // .color("name", cli)
@@ -163,49 +166,51 @@ function Map(prop) {
                     .shape('circle')
                     .color("name", cli)
                     .size('size', v => {
-                        let p = v / source[0].size;
-                        p < 0.3 ? p = (p + 0.2).toFixed(2) - 0 : '';
-                        return 30
+                        // let p = v / source[0].size;
+                        // p < 0.3 ? p = (p + 0.2).toFixed(2) - 0 : '';
+                        let p = (v / total * 100).toFixed(2) - 0;
+                        if (p < 30) return p + 30;
+                        return p
                     })
                     .animate(true)
                     .style({
-                        raisingHeight: 150000,
+                        raisingHeight: 0,
                     });
 
                 // 柱子
-                const barLayer = new PointLayer({ zIndex: 2, depth: false })
-                    .source(
-                        source,
-                        {
-                            parser: {
-                                type: 'json',
-                                x: 'lng',
-                                y: 'lat'
-                            }
-                        }
-                    )
-                    .shape('cylinder')
-                    .color("name", cli)
-                    .size('size', v => {
-                        let p = v / source[0].size;
-                        p < 0.3 ? p = (p + 0.2).toFixed(2) - 0 : '';
-                        return [5, 5, p * 100]
-                    })
-                    .animate(true)
-                    .style({
-                        raisingHeight: 150000,
-                        opacityLinear: {
-                            enable: true, // true - false
-                            dir: 'up' // up - down
-                        },
-                        lightEnable: false
-                    });
+                // const barLayer = new PointLayer({ zIndex: 2, depth: false })
+                //     .source(
+                //         source,
+                //         {
+                //             parser: {
+                //                 type: 'json',
+                //                 x: 'lng',
+                //                 y: 'lat'
+                //             }
+                //         }
+                //     )
+                //     .shape('cylinder')
+                //     .color("name", cli)
+                //     .size('size', v => {
+                //         let p = v / source[0].size;
+                //         p < 0.3 ? p = (p + 0.2).toFixed(2) - 0 : '';
+                //         return [5, 5, p * 100]
+                //     })
+                //     .animate(true)
+                //     .style({
+                //         raisingHeight: 1,
+                //         opacityLinear: {
+                //             enable: true, // true - false
+                //             dir: 'up' // up - down
+                //         },
+                //         lightEnable: false
+                //     });
                 scene.addLayer(gd);
-                scene.addLayer(bottomLayer);
+                // scene.addLayer(bottomLayer);
                 scene.addLayer(layer);
                 scene.addLayer(lineUp);
                 scene.addLayer(waveLayer);
-                scene.addLayer(barLayer);
+                // scene.addLayer(barLayer);
 
                 timeout()
                 mapFun();
@@ -262,7 +267,7 @@ function Map(prop) {
                 padding: [1, 1], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
                 stroke: '#FFFFFF', // 描边颜色
                 strokeWidth: 0.2, // 描边宽度
-                raisingHeight: 90000,
+                raisingHeight: 1,
                 textAllowOverlap: true
             });
         scene.addLayer(textLayer);
@@ -280,8 +285,8 @@ function Map(prop) {
         }}>
             <div class="head">{prop.title}</div>
             <div ref={$canvas} style={{
-                width:`${prop.width}px`,
-                height:`${prop.height}px`,
+                width: `${prop.width}px`,
+                height: `${prop.height}px`,
                 position: 'relative'
             }}></div>
         </div>

src/pages/bigScreen/components/NewMedia.jsx

@@ -2,6 +2,23 @@ import { onMount, createSignal, createEffect, For } from "solid-js";
 import utils from "../../../utils/index"
 import "../../../assets/style/BigScreenHome.css"
 
+import wx from "../../../assets/img/微信.png";
+import wxo from "../../../assets/img/微信-o.png";
+import ks from "../../../assets/img/快手.png";
+import kso from "../../../assets/img/快手-o.png";
+import qdxw from "../../../assets/img/起点新闻.png";
+import qdxwo from "../../../assets/img/起点新闻-o.png";
+import ssp from "../../../assets/img/闪视频.png";
+import sspo from "../../../assets/img/闪视频-o.png";
+import sxtt from "../../../assets/img/陕西头条.png";
+import sxtto from "../../../assets/img/陕西头条-o.png";
+import tt from "../../../assets/img/头条.png";
+import tto from "../../../assets/img/头条-o.png";
+import wb from "../../../assets/img/微博.png";
+import wbo from "../../../assets/img/微博-o.png";
+import dy from "../../../assets/img/抖音.png";
+import dyo from "../../../assets/img/抖音-o.png";
+
 let timeout = undefined;
 function NewMedia(prop) {
     function getlist() {
@@ -40,12 +57,24 @@ function NewMedia(prop) {
         if (prop.width) p.width = `${prop.width}px`;
         if (prop.height) p.height = `${prop.height + 40}px`;
     })
+
+    const getimg = (text, isSelect) => {
+        if (text === '微信') return isSelect ? wxo : wx;
+        if (text === '微博') return isSelect ? wbo : wb;
+        if (text === '抖音') return isSelect ? dyo : dy;
+        if (text === '头条') return isSelect ? tto : tt;
+        if (text === '快手') return isSelect ? kso : ks;
+        if (text === '陕西头条') return isSelect ? sxtto : sxtt;
+        if (text === '闪视频') return isSelect ? sspo : ssp;
+        if (text === '起点新闻') return isSelect ? qdxwo : qdxw;
+    }
+
     return (
-        <div class="livRang" style={p}>
-            <div class="head">{prop.title}</div>
+        <div class="livRang newMdia" style={p}>
+            <div class="head">{prop.title}1</div>
             <div style={{ "white-space": "nowrap", "display": "flex" }}>
                 <For each={prop.list}>{(item, i) => <div class="TabBtn">
-                    <img onClick={() => imgClick(i())} style={{ "width": "100%", "vertical-align": "middle", "margin-right": "3px" }} src={'/assets/img/' + item.name + (act() === i() ? '-o' : '') + '.png'} />
+                    <img onClick={() => imgClick(i())} class="tabIcon" src={getimg(item.name, act() === i())} />
                     {/* <span style="vertical-align: middle;">{item.name}</span> */}
                 </div>}</For>
             </div>

src/router/index.jsx

@@ -1,25 +1,13 @@
-import { lazy, createSignal, Show, For } from "solid-js";
-import { Routes, Route, Link } from "solid-app-router";
+import { lazy, createSignal, Show } from "solid-js";
+import { Routes, Route } from "solid-app-router";
 
-import BacgroundMap from "../components/bacgroundMap"
 import TitleStyle from "../components/titleStyle"
 
 import baseText from "../base/baseText"
-
-const First = lazy(() => import("../pages/First"))
-const Second = lazy(() => import("../pages/Second"))
-const Third = lazy(() => import("../pages/Third"))
-const Fourth = lazy(() => import("../pages/Fourth"))
-const Fifth = lazy(() => import("../pages/Fifth"))
 const BigScreen = lazy(() => import("../pages/BigScreen/Home"))
 
 const [BottomLi, setBottomLi] = createSignal(baseText.bottoms);
 
-const changeBottomTab = function (e) {
-    const path = e.target.getAttribute("path");
-    setBottomLi(BottomLi().map(bot => (bot.path !== path ? { ...bot, select: false } : { ...bot, select: true })));
-}
-
 export default function localRouter() {
     // 根据路由选择tab
     setBottomLi(BottomLi().map(bot => (bot.path === location.pathname ? { ...bot, select: true } : { ...bot, select: false })));
@@ -29,21 +17,6 @@ export default function localRouter() {
         </Show>
         <Routes>
             <Route path="/" element={<BigScreen />} />
-            <Route path="/First" element={<First />} />
-            <Route path="/Second" element={<Second />} />
-            <Route path="/Third" element={<Third />} />
-            <Route path="/Fourth" element={<Fourth />} />
-            <Route path="/Fifth" element={<Fifth />} />
         </Routes>
-        <Show when={location.pathname !== '/'}>
-            <div class='bottom'>
-                <For each={BottomLi()}>{bottom =>
-                    <Link onClick={changeBottomTab} class="nav" href={bottom.path} path={bottom.path} classList={{ 'item': true, 'act': bottom.select }}>
-                        {bottom.name}
-                    </Link>
-                }</For>
-            </div>
-            <BacgroundMap typa />
-        </Show>
     </>
 }

src/utils/index.js

@@ -32,15 +32,15 @@ export default {
 			sec
 		}
 	},
-    formatNumber(num, d){
+    formatNumber(num, d=2){
         if(isNaN(num)) return '0';
         let dw = "";
         if (num >= 100000000) {
             dw = "亿";
-            num = (num / 100000000).toFixed(d || 2) - 0;
+            num = (num / 100000000).toFixed(d) - 0;
         } else if (num >= 10000) {
             dw = "万";
-            num = (num / 10000).toFixed(d || 2) - 0;
+            num = (num / 10000).toFixed(d) - 0;
         }
         num = num.toString().split(".")
         if(num.length > 1) {

vite.config.js

@@ -1,17 +1,18 @@
-import { defineConfig } from "vite";
-import solidPlugin from "vite-plugin-solid";
+import { defineConfig } from 'vite';
+import solidPlugin from 'vite-plugin-solid';
 
 export default defineConfig({
   server: {
     // https: true,
+    open: false,
     watch: {
       usePolling: true,
     },
-    hmr: true
+    hmr: true,
   },
   plugins: [solidPlugin()],
   build: {
-    target: "esnext",
+    target: 'esnext',
     polyfillDynamicImport: false,
   },
 });