增加地图（待改）

Author: CzNd

backend/app/api/routes/data_analysis.py

@@ -13,6 +13,7 @@
 from app.models import GPSRecord
 import math
 from typing import List, Tuple, Optional
+from fastapi.responses import FileResponse
 
 router = APIRouter(prefix="/analysis", tags=["analysis"])
 
@@ -508,4 +509,14 @@ def get_gps_records_corrected(
                 }
             }
     except Exception as e:
-        return {"error": str(e)} 
+        return {"error": str(e)} 
+
+@router.get("/jinan-geojson")
+def get_jinan_geojson():
+    """
+    返回济南市geojson地图数据
+    """
+    geojson_path = Path("app/data/json/370100_full.json")
+    if not geojson_path.exists():
+        return JSONResponse(status_code=404, content={"error": "济南市geojson文件不存在"})
+    return FileResponse(str(geojson_path), media_type="application/json") 

backend/data/json/370100_full.json

@@ -17,6 +17,8 @@ export default function PassengerCountChart() {
   const [loading, setLoading] = useState(false)
   const [interval, setInterval] = useState<'15min' | '1h'>('15min')
   const [date, setDate] = useState(formatDate(new Date('2013-09-12')))
+  const [mapLoaded, setMapLoaded] = useState(false)
+  const [mapOption, setMapOption] = useState<any>(null)
 
   useEffect(() => {
     setLoading(true)
@@ -27,6 +29,55 @@ export default function PassengerCountChart() {
       .finally(() => setLoading(false))
   }, [interval])
 
+  useEffect(() => {
+    fetch('/370100_full.json')
+      .then(res => res.json())
+      .then(geoJson => {
+        // 注册地图
+        // @ts-ignore
+        import('echarts').then(echarts => {
+          echarts.registerMap('jinan', geoJson)
+          setMapLoaded(true)
+          setMapOption({
+            title: { text: '济南市地图', left: 'center' },
+            tooltip: { trigger: 'item' },
+            visualMap: {
+              min: 0,
+              max: 100,
+              left: 'left',
+              top: 'bottom',
+              text: ['高', '低'],
+              inRange: { color: ['#e0ffff', '#006edd'] },
+              show: true
+            },
+            series: [
+              {
+                name: '区域数据',
+                type: 'map',
+                map: 'jinan',
+                roam: true,
+                label: { show: true },
+                data: [
+                  { name: '历下区', value: 50 },
+                  { name: '市中区', value: 80 },
+                  { name: '槐荫区', value: 60 },
+                  { name: '天桥区', value: 70 },
+                  { name: '历城区', value: 90 },
+                  { name: '长清区', value: 40 },
+                  { name: '章丘区', value: 30 },
+                  { name: '济阳区', value: 20 },
+                  { name: '莱芜区', value: 10 },
+                  { name: '钢城区', value: 15 },
+                  { name: '平阴县', value: 25 },
+                  { name: '商河县', value: 35 }
+                ]
+              }
+            ]
+          })
+        })
+      })
+  }, [])
+
   const statOption = {
     title: { text: `${interval === '15min' ? '15分钟' : '1小时'}乘客数量分布`, left: 'center' },
     tooltip: { trigger: 'axis' },
@@ -82,6 +133,13 @@ export default function PassengerCountChart() {
       ) : (
         <ReactECharts style={{height: 400}} option={statOption} notMerge={true} lazyUpdate={true} />
       )}
+      {/* 新增济南市地图展示 */}
+      <Text mt={8} mb={2} fontWeight="bold">济南市地图：</Text>
+      {mapLoaded && mapOption ? (
+        <ReactECharts style={{height: 500}} option={mapOption} notMerge={true} lazyUpdate={true} />
+      ) : (
+        <Text>地图加载中...</Text>
+      )}
     </>
   )
 }