[fix]Fix map json path, map data request API add range date filter co…

…ndition (#97)
wuhan2020 · Sep 21, 2024 · 9fc7d84 · 9fc7d84 · github-actions · Sep 21, 2024
1 parent a81238f
commit 9fc7d84
Show file tree

Hide file tree

Showing 5 changed files with 48 additions and 11 deletions.
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/source/page/Map/component/EChartsMap.tsx b/source/page/Map/component/EChartsMap.tsx
@@ -2,7 +2,9 @@ import { DataObject } from 'dom-renderer';
 import { WebCell, component, attribute, observer } from 'web-cell';
 import { observable } from 'mobx';
 import { EChartsOption, EChartsType, init, registerMap } from 'echarts';
+import { formatDate } from 'web-utility';
 
+import { getHistory, Province } from '../../../service/Epidemic';
 import { long2short } from '../adapter';
 
 export interface EChartsMapProps {
@@ -92,13 +94,17 @@ export class EChartsMap
                     hovered = '';
                 }
             })
-            .on('click', 'timeline', ({ dataIndex }) =>
+            .on('click', 'timeline', async ({ dataIndex }) => {
+                const formattedDate = formatDate(dataIndex, 'YYYY-MM-DD');
                 chart.dispatchAction({
                     type: 'timelineChange',
                     // index of time point
                     currentIndex: data.findIndex(d => d === dataIndex)
-                })
-            );
+                });
+                const newData = await getHistory(formattedDate);
+
+                this.updateChartData(newData);
+            });
     }
 
     async loadData() {
@@ -119,4 +125,16 @@ export class EChartsMap
 
         chart.hideLoading();
     }
+    updateChartData(newData: Province[]) {
+        this.chart.setOption({
+            series: [
+                {
+                    data: newData.map(item => ({
+                        name: item.provinceShortName,
+                        value: item.confirmedCount
+                    }))
+                }
+            ]
+        });
+    }
 }
diff --git a/source/page/Map/component/VirusMap.tsx b/source/page/Map/component/VirusMap.tsx
@@ -1,6 +1,6 @@
 import { WebCell, component, attribute, observer } from 'web-cell';
 import { observable } from 'mobx';
-import { Hour } from 'web-utility';
+import { Day, Hour } from 'web-utility';
 
 import { EChartsMapProps, EChartsMap } from './EChartsMap';
 import { VirusChart } from './VirusChart';
@@ -238,6 +238,14 @@ export class VirusMap extends HTMLElement implements WebCell<VirusMapProps> {
         return options;
     };
 
+    get timelineData() {
+        const startDate = +new Date('2022-09-01');
+        const endDate = +new Date('2022-09-28');
+        return Array.from(
+            { length: (endDate - startDate) / Day + 1 },
+            (_, i) => startDate + Day * i
+        );
+    }
     getSTChartOptions = (data: STMapDataType, options?: any) => {
         options ||= this.baseOptions(this.name, this.breaks);
         options['timeline'] = {
@@ -246,7 +254,7 @@ export class VirusMap extends HTMLElement implements WebCell<VirusMapProps> {
             tooltip: {},
             playInterval: 1500,
             currentIndex: data.timeline.length - 1,
-            data: data.timeline,
+            data: this.timelineData,
             left: 'left',
             right: 0,
             label: {
@@ -264,7 +272,8 @@ export class VirusMap extends HTMLElement implements WebCell<VirusMapProps> {
                 }
             }
         };
-        const sortedTimeline = data.timeline.slice().sort();
+
+        const sortedTimeline = [...data.timeline].sort();
 
         return {
             baseOption: options,

diff --git a/source/page/Map/data/province.ts b/source/page/Map/data/province.ts
@@ -1,4 +1,5 @@
-const server_root = 'https://geo.datav.aliyun.com/areas_v3/bound/';
+const server_root =
+    'https://oss-toolbox.kaiyuanshe.cn/proxy/geo.datav.aliyun.com/areas_v3/bound/';
 
 export default {
     中国: server_root + '100000_full.json',

diff --git a/source/service/Epidemic.ts b/source/service/Epidemic.ts
@@ -85,9 +85,18 @@ export async function getOverall() {
 
     return body;
 }
-
-export async function getHistory() {
-    const { body } = await epidemic.get<AreaData[]>('Area', { Range: '0-199' });
+export async function getHistory(date = '2022-09-01') {
+    const startOfDay = `${date}T00:00:00`;
+    const endOfDay = `${date}T23:59:59`;
+
+    const { body } = await epidemic.get<AreaData[]>(
+        `Area?${new URLSearchParams([
+            ['updateTime', `gt.${startOfDay}`],
+            ['updateTime', `lt.${endOfDay}`],
+            ['countryName', 'eq.中国'],
+            ['limit', '299']
+        ])}`
+    );
 
     const updatedBody = body.map(item => ({
         id: item.id,