Fix map max zoom (#1584)

* docs: add 行政区demo

* fix: lint error

* docs: scale 文档更新

dev-demos/bugs/marker/demo.tsx

@@ -1,5 +1,5 @@
 // @ts-ignore
-import { MarkerLayer, Marker, Scene } from '@antv/l7';
+import { Marker, MarkerLayer, Scene } from '@antv/l7';
 // @ts-ignore
 import { GaodeMap } from '@antv/l7-maps';
 import React, { useEffect } from 'react';

dev-demos/bugs/polygon/demos/district.tsx

@@ -0,0 +1,59 @@
+// https://unpkg.com/xinzhengqu@1.0.0/data/2023_xian.pbf
+
+// @ts-ignore
+import { PolygonLayer, Scene,Popup } from '@antv/l7';
+// @ts-ignore
+import { GaodeMap, Mapbox } from '@antv/l7-maps';
+import React, { useEffect } from 'react';
+import geobuf from 'geobuf';
+import Pbf from 'pbf';
+import * as turf from '@turf/turf'
+  
+export default () => {
+  // @ts-ignore
+    useEffect( async () => {
+      console.time('load')
+      const response = await fetch(
+        'https://unpkg.com/xinzhengqu@1.0.0/data/2023_xian.pbf',
+      );
+      let shapeType = '01'
+      const scene = new Scene({
+        id: 'map',
+        map: new GaodeMap({
+          center: [121.4, 31.258134],
+          zoom: 2,
+          pitch: 0,
+          style: 'normal',
+          doubleClickZoom:false,
+        }),
+      });
+  
+      const data = await response.arrayBuffer();
+
+      const geojson = geobuf.decode(new Pbf(data));
+      var options = {tolerance: 0.005, highQuality: false};
+      var simplified = turf.simplify(geojson, options);
+
+      
+      const fill = new PolygonLayer({
+        autoFit:false
+      })
+        .source(simplified)
+        .shape('fill')
+        .color('ENG_NAME',['#a6cee3','#1f78b4','#b2df8a','#33a02c','#fb9a99','#e31a1c','#fdbf6f','#ff7f00','#cab2d6','#6a3d9a','#ffff99','#b15928'])
+        .active(false)
+       
+      scene.addLayer(fill);
+          
+    }, []);
+    return (
+      <div
+        id="map"
+        style={{
+          height: '500px',
+          position: 'relative',
+        }}
+      />
+    );
+  };
+  

dev-demos/bugs/polygon/district.md

@@ -0,0 +1,2 @@
+### district
+<code src="./demos/district.tsx"></code>

dev-demos/component/control/exportImage.tsx

@@ -1,4 +1,4 @@
-import { GaodeMap, Scene, ExportImage, PointLayer } from '@antv/l7';
+import { ExportImage, GaodeMap, PointLayer, Scene } from '@antv/l7';
 import React, { useState } from 'react';
 // tslint:disable-next-line:no-duplicate-imports
 import { FunctionComponent, useEffect } from 'react';

dev-demos/component/control/fullscreen.tsx

@@ -1,4 +1,4 @@
-import { GaodeMap, Scene, Fullscreen } from '@antv/l7';
+import { Fullscreen, GaodeMap, Scene } from '@antv/l7';
 import React from 'react';
 // tslint:disable-next-line:no-duplicate-imports
 import { FunctionComponent, useEffect } from 'react';

dev-demos/component/control/hide.tsx

@@ -1,4 +1,4 @@
-import { GaodeMap, Scene, MapTheme } from '@antv/l7';
+import { GaodeMap, MapTheme, Scene } from '@antv/l7';
 import React, { useState } from 'react';
 // tslint:disable-next-line:no-duplicate-imports
 import { FunctionComponent, useEffect } from 'react';

dev-demos/component/control/layerSwitch.tsx

@@ -1,11 +1,11 @@
 import {
   GaodeMap,
-  Scene,
-  LayerSwitch,
   ILayer,
-  PointLayer,
+  LayerSwitch,
   LineLayer,
+  PointLayer,
   PolygonLayer,
+  Scene,
 } from '@antv/l7';
 import React, { useState } from 'react';
 // tslint:disable-next-line:no-duplicate-imports

dev-demos/component/control/logo.tsx

@@ -1,4 +1,4 @@
-import { GaodeMap, Scene, Logo } from '@antv/l7';
+import { GaodeMap, Logo, Scene } from '@antv/l7';
 import React from 'react';
 // tslint:disable-next-line:no-duplicate-imports
 import { FunctionComponent, useEffect } from 'react';

dev-demos/component/control/mapTheme.tsx

@@ -1,4 +1,4 @@
-import { GaodeMap, Scene, MapTheme } from '@antv/l7';
+import { GaodeMap, MapTheme, Scene } from '@antv/l7';
 import React from 'react';
 // tslint:disable-next-line:no-duplicate-imports
 import { FunctionComponent, useEffect } from 'react';

dev-demos/component/control/mouseLocation.tsx

@@ -1,4 +1,4 @@
-import { GaodeMap, Scene, MouseLocation } from '@antv/l7';
+import { GaodeMap, MouseLocation, Scene } from '@antv/l7';
 import React from 'react';
 // tslint:disable-next-line:no-duplicate-imports
 import { FunctionComponent, useEffect } from 'react';

dev-demos/component/control/scale.tsx

@@ -1,4 +1,4 @@
-import { GaodeMap, Scene, Scale } from '@antv/l7';
+import { GaodeMap, Scale, Scene } from '@antv/l7';
 import React, { useState } from 'react';
 // tslint:disable-next-line:no-duplicate-imports
 import { FunctionComponent, useEffect } from 'react';

dev-demos/component/popup/layerPopup.tsx

@@ -5,7 +5,6 @@ import {
   PointLayer,
   PolygonLayer,
   Scene,
-  // anchorType,
 } from '@antv/l7';
 import { circle, featureCollection, point } from '@turf/turf';
 import React, { useState } from 'react';

dev-demos/component/popup/popup.tsx

@@ -1,11 +1,10 @@
 import {
+  anchorType,
+  Fullscreen,
   GaodeMap,
   PointLayer,
   Popup,
   Scene,
-  Fullscreen,
-  anchorType,
-  // anchorType,
 } from '@antv/l7';
 import { featureCollection, point } from '@turf/turf';
 import React, { useState } from 'react';

dev-demos/draw/demo/drawControl.tsx

@@ -1,4 +1,4 @@
-import { Scene, RasterLayer } from '@antv/l7';
+import { RasterLayer, Scene } from '@antv/l7';
 import { DrawControl } from '@antv/l7-draw';
 import { Map } from '@antv/l7-maps';
 import React, { useEffect } from 'react';

dev-demos/draw/demo/drawpolygon.tsx

@@ -1,33 +1,65 @@
-import { Scene } from '@antv/l7';
-import { DrawPolygon } from '@antv/l7-draw';
-import { Map } from '@antv/l7-maps';
+import { Scene,PointLayer,Marker } from '@antv/l7';
+import { DrawPoint,DrawEvent } from '@antv/l7-draw';
+import { Mapbox } from '@antv/l7-maps';
 import React, { useEffect, useState } from 'react';
 
 const id = String(Math.random());
 
 const Demo: React.FC = () => {
-  const [, setLineDrawer] = useState<DrawPolygon | null>(null);
+  const [, setLineDrawer] = useState<DrawPoint | null>(null);
 
   useEffect(() => {
     const scene = new Scene({
       id,
-      map: new Map({
-        center: [120.151634, 30.244831],
+      map: new Mapbox({
+        center:  [
+          116.39153415221631,
+          39.90678816789074
+        ],
         pitch: 0,
-        style: 'dark',
-        zoom: 10,
+        style: 'mapbox://styles/mapbox/streets-v12',
+        zoom: 22,
+        token:
+        "pk.eyJ1IjoibW9ob25nIiwiYSI6ImNrNGFsdjY5ZzA1NW4zbG14b2JoMnA5c3IifQ.1qVWFsyHW2wKThTgQg08SA"
       }),
     });
-    scene.on('mousedown', () => {
-      console.log('mousedown');
-    });
-
+   
     scene.on('loaded', () => {
-      const drawer = new DrawPolygon(scene, {
+      const point = new PointLayer().source({
+        "type": "FeatureCollection",
+        "features": [
+          {
+            "type": "Feature",
+            "properties": {},
+            "geometry": {
+              "coordinates": [
+                116.39153415221631,
+                39.90678816789074
+              ],
+              "type": "Point"
+            }
+          }
+        ]
+      }).color('red')
+      .shape('circle')
+      .size(5);
+
+      const marker = new Marker().setLnglat({ lng:116.39153415221631, lat: 39.90678816789074 });
+      scene.addMarker(marker);
+      scene.addLayer(point)
+      const drawer = new DrawPoint(scene, {
         // liveUpdate: true,
       });
+      scene.on('zoomend',()=>{
+        console.log(scene.getZoom())
+      })
+     
       setLineDrawer(drawer);
       drawer.enable();
+      drawer.on(DrawEvent.Add, (newPoint, pointList) => {
+        console.log('add', newPoint, pointList);
+      });
+  
     });
   }, []);
 

dev-demos/features/citybuilding/amap1.tsx

@@ -1,5 +1,5 @@
 // @ts-ignore
-import { Scene, CityBuildingLayer, LineLayer, PolygonLayer } from '@antv/l7';
+import { CityBuildingLayer, LineLayer, PolygonLayer, Scene } from '@antv/l7';
 // @ts-ignore
 import { GaodeMap } from '@antv/l7-maps';
 import React, { useEffect } from 'react';

dev-demos/features/citybuilding/amap2.tsx

@@ -1,5 +1,5 @@
 // @ts-ignore
-import { Scene, CityBuildingLayer, LineLayer, PolygonLayer } from '@antv/l7';
+import { CityBuildingLayer, LineLayer, PolygonLayer, Scene } from '@antv/l7';
 // @ts-ignore
 import { GaodeMap } from '@antv/l7-maps';
 import React, { useEffect } from 'react';

dev-demos/features/citybuilding/mapbox.tsx

@@ -1,5 +1,5 @@
 // @ts-ignore
-import { Scene, CityBuildingLayer, LineLayer, PolygonLayer } from '@antv/l7';
+import { CityBuildingLayer, LineLayer, PolygonLayer, Scene } from '@antv/l7';
 // @ts-ignore
 import { Mapbox } from '@antv/l7-maps';
 import React, { useEffect } from 'react';

dev-demos/features/earth/earth.tsx

@@ -1,5 +1,5 @@
 // @ts-ignore
-import { Scene, Earth, EarthLayer } from '@antv/l7';
+import { Earth, EarthLayer, Scene } from '@antv/l7';
 
 import React, { useEffect } from 'react';
 

dev-demos/features/imageLayer/raster.tsx

@@ -2,8 +2,8 @@
 import { RasterLayer, Scene } from '@antv/l7';
 // @ts-ignore
 import { GaodeMap } from '@antv/l7-maps';
-import React, { useEffect } from 'react';
 import * as GeoTIFF from 'geotiff';
+import React, { useEffect } from 'react';
 
 async function getTiffData() {
   const response = await fetch(

dev-demos/features/legend/cat.tsx

@@ -3,7 +3,7 @@ import { Button } from 'antd';
 
 import { Map } from '@antv/l7-maps';
 import React, { useEffect, useState } from 'react';
-import { useData, addLayers } from './useLine';
+import { addLayers, useData } from './useLine';
 
 export default () => {
   const { geoData } = useData();

dev-demos/features/tile/worldmap.tsx

@@ -1,11 +1,9 @@
 // @ts-ignore
 import {
+  PolygonLayer,
   Scene,
   // LineLayer,
   Source,
-  PolygonLayer,
-  // PointLayer,
-  // TileDebugLayer,
 } from '@antv/l7';
 // @ts-ignore
 import { Map } from '@antv/l7-maps';

dev-demos/gallery/scale/diverging.tsx

@@ -1,7 +1,7 @@
 import { PolygonLayer, Scene } from '@antv/l7';
 import { Map } from '@antv/l7-maps';
 import React, { useEffect, useState } from 'react';
-import { useEuropeData, addEuropeLayers } from './useLine';
+import { addEuropeLayers, useEuropeData } from './useLine';
 
 export default () => {
   const { geoData } = useEuropeData();

dev-demos/gallery/scale/linear.tsx

@@ -1,7 +1,7 @@
 import { PolygonLayer, Scene } from '@antv/l7';
 import { Map } from '@antv/l7-maps';
 import React, { useEffect } from 'react';
-import { useData, addLayers } from './useLine';
+import { addLayers, useData } from './useLine';
 
 export default () => {
   const { geoData } = useData();

dev-demos/gallery/scale/map.tsx

@@ -1,4 +1,4 @@
-import { PolygonLayer, LineLayer, PointLayer, Scene, Source } from '@antv/l7';
+import { LineLayer, PointLayer, PolygonLayer, Scene, Source } from '@antv/l7';
 import { GaodeMap } from '@antv/l7-maps';
 import React, { useEffect } from 'react';
 

dev-demos/gallery/scale/quantile.tsx

@@ -1,7 +1,7 @@
 import { PolygonLayer, Scene } from '@antv/l7';
 import { GaodeMap } from '@antv/l7-maps';
 import React, { useEffect } from 'react';
-import { useData, addLayers } from './useLine';
+import { addLayers, useData } from './useLine';
 
 export default () => {
   const { geoData } = useData();

dev-demos/gallery/scale/quantize.tsx

@@ -1,7 +1,7 @@
 import { PolygonLayer, Scene } from '@antv/l7';
 import { GaodeMap } from '@antv/l7-maps';
 import React, { useEffect } from 'react';
-import { useData, addLayers } from './useLine';
+import { addLayers, useData } from './useLine';
 
 export default () => {
   const { geoData } = useData();

dev-demos/gallery/scale/sequential.tsx

@@ -1,7 +1,7 @@
 import { PolygonLayer, Scene } from '@antv/l7';
 import { Map } from '@antv/l7-maps';
 import React, { useEffect } from 'react';
-import { useData, addLayers } from './useLine';
+import { addLayers, useData } from './useLine';
 
 export default () => {
   const { geoData } = useData();

dev-demos/gallery/scale/threshold.tsx

@@ -1,7 +1,7 @@
 import { PolygonLayer, Scene } from '@antv/l7';
 import { Map } from '@antv/l7-maps';
 import React, { useEffect } from 'react';
-import { useData, addLayers } from './useLine';
+import { addLayers, useData } from './useLine';
 
 export default () => {
   const { geoData } = useData();

dev-demos/raster/demos/rasterFile.tsx

@@ -2,8 +2,8 @@
 import { RasterLayer, Scene } from '@antv/l7';
 // @ts-ignore
 import { GaodeMap } from '@antv/l7-maps';
-import React, { useEffect } from 'react';
 import * as GeoTIFF from 'geotiff';
+import React, { useEffect } from 'react';
 
 async function getTiffData() {
   const response = await fetch(

package.json

@@ -89,6 +89,7 @@
     "eslint-plugin-unused-imports": "^2.0.0",
     "father": "^4.1.0",
     "gcoord": "^0.3.2",
+    "geobuf": "^3.0.2",
     "geotiff": "1.0.0-beta.10",
     "gh-pages": "^2.1.1",
     "gl": "^5.0.3",

packages/site/docs/common/layer/layer_encode.md

@@ -83,7 +83,7 @@ Scale 度量是将地图数据值（数字、日期、类别等数据）转成
 
 ### scale
 
-![Scale 详细介绍](https://mp.weixin.qq.com/s/QyD1_ypu0PDwMxEz45v6Jg)
+[Scale 详细介绍](https://mp.weixin.qq.com/s/QyD1_ypu0PDwMxEz45v6Jg)
 
 参数： (field: string, scaleOptions: IscaleOptions)
 - `field` 指定 source 中传入的数据中用于映射的字段名

packages/site/docs/tutorial/scale.zh.md

@@ -98,13 +98,6 @@ layer.scale('type', {
 });
 layer.color('type', ['red', 'white', 'blue', 'yellow']);
 
-```
-
-layer.scale('type', {
-  type: 'cat',
-  domain: ['B', 'A', 'C', 'D'],
-});
-layer.color('type', ['red', 'white', 'blue', 'yellow']);
 ```
 ![L7 Cat ](https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*kyP2RpUXdGUAAAAAAAAAAAAADmJ7AQ/original)
 
@@ -112,7 +105,7 @@ layer.color('type', ['red', 'white', 'blue', 'yellow']);
 
 线性是连续数据的映射方法，数据和视觉值是通过线性方法计算的。如数据范围domain [0,1000] 线性映射到 range [red,blue] 渐变色，就是依据线性函完成一一转换。
 
-![L7 Scale 线性]('https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Z_rGRr-jgI0AAAAAAAAAAAAADmJ7AQ/original')
+![L7 Scale 线性](https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Z_rGRr-jgI0AAAAAAAAAAAAADmJ7AQ/original')
 
 ```tsx
 layer.color('rate', ['#ffffcc', '#b6e2b6', '#64c1c0', '#338cbb', '#253494'])
@@ -121,7 +114,7 @@ layer.color('rate', ['#ffffcc', '#b6e2b6', '#64c1c0', '#338cbb', '#253494'])
 数据 L7 默认会设置为 linear, domain为数据的min、max值。颜色会根据 range 颜色生成渐变色。linear
 默认可不设置 domain 区间
 
-```
+```ts
 layer.scale('value', {
   type: 'linear',
   domain: [5, 100], // 可定义domain,也可以不设置，自定根据数据计算

packages/source/src/transform/hexagon.ts

@@ -1,7 +1,7 @@
+import { IParseDataItem, IParserData, ITransform } from '@antv/l7-core';
 import { aProjectFlat, Satistics } from '@antv/l7-utils';
 import { hexbin } from 'd3-hexbin';
 const R_EARTH = 6378000;
-import { IParseDataItem, IParserData, ITransform } from '@antv/l7-core';
 interface IHexBinItem<T> extends Array<T> {
   x: number;
   y: number;

packages/utils/src/tileset-manager/index.ts

@@ -1,5 +1,5 @@
-export * from './utils/tile-url';
-export * from './types';
 export { SourceTile } from './tile';
 export { TilesetManager } from './tileset-manager';
+export * from './types';
 export * from './utils/lonlat-tile';
+export * from './utils/tile-url';