revert: restore v1.1.14 (37a9f303)

src/modules/hydrogen-heatmap/HydrogenAmapCanvas.tsx

@@ -1,6 +1,5 @@
 import { useEffect, useMemo, useRef, useState } from 'react';
 import type { AmapConfig, HydrogenHeatmapMetric, HydrogenHeatmapPoint } from './types';
-import { createHeatmapMap, loadAmap, type AmapInstance } from '../../shared/amap';
 
 type Props = {
   config: AmapConfig;
@@ -11,6 +10,19 @@ type Props = {
   onMapClick: (longitude: number, latitude: number) => void;
 };
 
+type AmapInstance = {
+  Map: new (container: HTMLElement, options: Record<string, unknown>) => any;
+  HeatMap: new (map: any, options: Record<string, unknown>) => any;
+  ToolBar: new (options?: Record<string, unknown>) => any;
+  Scale: new (options?: Record<string, unknown>) => any;
+  Bounds: new (southWest: [number, number], northEast: [number, number]) => any;
+};
+
+declare global {
+  interface Window {
+    _AMapSecurityConfig?: { securityJsCode: string };
+  }
+}
 
 function getBounds(points: HydrogenHeatmapPoint[]) {
   if (!points.length) return null;
@@ -50,9 +62,36 @@ export default function HydrogenAmapCanvas({ config, points, max, metric, focusQ
 
     async function initialize() {
       try {
-        const AMap = await loadAmap(config);
+        window._AMapSecurityConfig = { securityJsCode: config.securityCode };
+        const loaderModule = await import('@amap/amap-jsapi-loader');
+        const AMap = await loaderModule.default.load({
+          key: config.key,
+          version: '2.0',
+          plugins: ['AMap.HeatMap', 'AMap.ToolBar', 'AMap.Scale'],
+        }) as unknown as AmapInstance;
         if (cancelled || !container) return;
-        const { map, heatmap } = createHeatmapMap(AMap, container, { radius: 34, opacity: [0.14, 0.84] });
+        const map = new AMap.Map(container, {
+          viewMode: '2D',
+          zoom: 5,
+          center: [105.4, 34.4],
+          mapStyle: 'amap://styles/whitesmoke',
+          resizeEnable: true,
+          showLabel: true,
+        });
+        map.addControl(new AMap.ToolBar({ position: { right: '20px', bottom: '76px' } }));
+        map.addControl(new AMap.Scale({ position: { right: '18px', bottom: '24px' } }));
+        const heatmap = new AMap.HeatMap(map, {
+          radius: 34,
+          opacity: [0.14, 0.84],
+          gradient: {
+            0.1: '#2563eb',
+            0.3: '#0891b2',
+            0.5: '#16a34a',
+            0.68: '#eab308',
+            0.84: '#f97316',
+            1: '#dc2626',
+          },
+        });
         map.on('click', (event: any) => clickHandlerRef.current(event.lnglat.getLng(), event.lnglat.getLat()));
         mapRef.current = map;
         heatmapRef.current = heatmap;