refactor: source types

antvis · Aug 18, 2023 · 42915a4 · 42915a4
1 parent b9b1957
commit 42915a4
Show file tree

Hide file tree

Showing 9 changed files with 86 additions and 44 deletions.
diff --git a/packages/li-core-assets/src/layers/MVTLayer/Component.tsx b/packages/li-core-assets/src/layers/MVTLayer/Component.tsx
@@ -4,15 +4,21 @@ import type { MVTLayerProps } from './mvt-layer';
 import MVTLayer from './mvt-layer';
 import type { MVTLayerSource } from './type';
 
-export interface MVTLayerWrapperProps extends ImplementLayerProps, MVTLayerProps {
+export interface MVTLayerWrapperProps extends ImplementLayerProps, Omit<MVTLayerProps, 'source'> {
   source: MVTLayerSource;
 }
 
 const MVTLayerWrapper: React.FC<MVTLayerWrapperProps> = (props) => {
   const { source } = props;
-  const metadataUrl = source.parser.metadataUrl;
+  const { data, parser } = source;
+  const metadataUrl = parser.metadataUrl;
 
-  return <MVTLayer {...props} metadataUrl={metadataUrl} />;
+  const mVTLayerSource = {
+    data: data,
+    parser,
+  };
+
+  return <MVTLayer {...props} metadataUrl={metadataUrl} source={mVTLayerSource} />;
 };
 
 export default MVTLayerWrapper;
diff --git a/packages/li-core-assets/src/layers/MVTLayer/demos/config.ts b/packages/li-core-assets/src/layers/MVTLayer/demos/config.ts
@@ -12,14 +12,11 @@ const config: Application = {
       metadata: {
         name: '330106',
         description: 'MVT Tile',
-        serviceType: 'MVT Tile',
       },
       properties: {
-        url: 'http://127.0.0.1:8080/330106/{z}/{x}/{y}.pbf',
-        parser: {
-          type: 'mvt',
-          metadataUrl: 'http://localhost:8080/330106/metadata.json',
-        },
+        type: 'mvt-tile',
+        url: 'https://tiles.lvisei.icu/xihuqu_330106/{z}/{x}/{y}.pbf',
+        metadataUrl: 'https://tiles.lvisei.icu/xihuqu_330106/metadata.json',
       },
     },
   ],

diff --git a/packages/li-core-assets/src/layers/MVTLayer/type.ts b/packages/li-core-assets/src/layers/MVTLayer/type.ts
@@ -1,12 +1,8 @@
+import type { LayerSourceConfig } from '@antv//li-sdk';
+
 export type MVTLayerSource = {
   data: string;
-  parser: {
-    type: 'mvt';
-    metadataUrl: string;
-    minZoom?: number;
-    maxZoom?: number;
-  };
-};
+} & Omit<LayerSourceConfig, 'datasetId'>;
 
 export type Tilestats = {
   layerCount: number;

diff --git a/packages/li-editor/src/widgets/DatasetsPanel/DatasetList/DatasetItem/index.tsx b/packages/li-editor/src/widgets/DatasetsPanel/DatasetList/DatasetItem/index.tsx
@@ -107,7 +107,7 @@ const DatasetItem = (props: DatasetItemProps) => {
               共<span className="li-dataset-list__info-count">{dataset.data.length}</span>行数据
             </>
           ) : (
-            dataset.metadata.description || dataset.type
+            dataset.metadata.description || dataset.properties.type
           )}
         </div>
       </div>

diff --git a/packages/li-editor/src/widgets/TilesetsDataset/MVTTile/index.tsx b/packages/li-editor/src/widgets/TilesetsDataset/MVTTile/index.tsx
@@ -48,11 +48,11 @@ const MVTTile = (props: MVTTileProps) => {
       metadata: {
         name,
         description: 'MVT Tile',
-        serviceType: 'MVT Tile',
       },
       properties: {
+        type: 'mvt-tile' as const,
         url,
-        parser: { type: 'mvt', metadataUrl },
+        metadataUrl,
       },
     };
     const layer = {

diff --git a/packages/li-editor/src/widgets/TilesetsDataset/XYZTile/index.tsx b/packages/li-editor/src/widgets/TilesetsDataset/XYZTile/index.tsx
@@ -34,11 +34,12 @@ const XYZTile = (props: XYZTileProps) => {
       metadata: {
         name,
         description: 'XYZ Tile',
-        serviceType: 'XYZ Tile',
       },
       properties: {
+        type: 'xyz-tile' as const,
         url,
-        parser: { type: 'rasterTile', tileSize: 256, minZoom: zoom.minZoom, maxZoom: zoom.maxZoom },
+        minZoom: zoom.minZoom,
+        maxZoom: zoom.maxZoom,
       },
     };
     const layer = {

diff --git a/packages/li-sdk/src/components/internal/WrapperLayer/hooks/useLayerProps.ts b/packages/li-sdk/src/components/internal/WrapperLayer/hooks/useLayerProps.ts
@@ -1,19 +1,38 @@
-import { merge, omit } from 'lodash-es';
+import { omit } from 'lodash-es';
 import { useMemo } from 'react';
 import { useDataset } from '../../../../hooks/useDataset';
-import type { LayerSchema } from '../../../../specs';
+import type { LayerSchema, LayerSourceConfig } from '../../../../specs';
+import type { Dataset } from '../../../../types';
 import { isLocalOrRemoteDataset } from '../../../../utils';
 
+const getLayerSource = (dataset: Dataset, sourceConfig: LayerSourceConfig) => {
+  if (isLocalOrRemoteDataset(dataset)) {
+    const restSourceConfig = omit(sourceConfig, ['datasetId', 'parser']);
+    return {
+      data: dataset.data,
+      parser: { type: 'json', ...sourceConfig?.parser },
+      ...restSourceConfig,
+    };
+  }
+
+  const tileProperties = dataset.properties;
+  const restTileProperties = omit(tileProperties, ['type', 'url']);
+  const restLayerSourceConfig = omit(sourceConfig, ['datasetId', 'parser']);
+  return {
+    data: dataset.properties.url,
+    // TODO: 数据冗余属性不注入进去
+    parser: { ...restTileProperties, ...sourceConfig.parser },
+    ...restLayerSourceConfig,
+  };
+};
+
 export const useLayerProps = (visConfig: LayerSchema['visConfig'], sourceConfig: LayerSchema['sourceConfig']) => {
   const datasetId = sourceConfig?.datasetId || '';
   const [dataset] = useDataset(datasetId);
 
   const layerProps = useMemo(() => {
     if (sourceConfig?.datasetId && dataset) {
-      const restSourceConfig = omit(sourceConfig, ['datasetId']);
-      const source = isLocalOrRemoteDataset(dataset)
-        ? { data: dataset.data, ...restSourceConfig }
-        : { data: dataset.properties.url, ...merge({}, omit(dataset.properties, ['url']), restSourceConfig) };
+      const source = getLayerSource(dataset, sourceConfig);
       return {
         ...visConfig,
         source,

diff --git a/packages/li-sdk/src/specs/dataset.ts b/packages/li-sdk/src/specs/dataset.ts
@@ -121,17 +121,18 @@ export type LocalDatasetSchema<T extends Record<string, any> = Record<string, an
 };
 
 /**
- * 矢量瓦片数据源类型
+ * XYZ 栅格瓦片服务配置项
  */
-export type VectorTileDatasetSchema = BaseDataset & {
-  type: 'vector-tile';
-  // 瓦片服务配置
-  properties: {
-    // 瓦片服务地址
-    url: string;
-    // 瓦片服务解析配置
-    parser: Record<string, any>;
-  };
+export type XYZRasterTileProperties = {
+  // 栅格瓦片服务类型
+  type: 'xyz-tile';
+  // 瓦片服务地址
+  url: string;
+  minZoom?: number;
+  maxZoom?: number;
+  tileSize?: number;
+  zoomOffset?: number;
+  extent?: [number, number, number, number];
 };
 
 /**
@@ -140,12 +141,33 @@ export type VectorTileDatasetSchema = BaseDataset & {
 export type RasterTileDatasetSchema = BaseDataset & {
   type: 'raster-tile';
   // 瓦片服务配置
-  properties: {
-    // 瓦片服务地址
-    url: string;
-    // 瓦片服务解析配置
-    parser: Record<string, any>;
-  };
+  properties: XYZRasterTileProperties;
+};
+
+/**
+ * MVT 矢量瓦片服务配置项
+ */
+export type MVTVectorTileProperties = {
+  // 矢量瓦片服务类型
+  type: 'mvt-tile';
+  // 瓦片服务地址
+  url: string;
+  // 矢量瓦片元数据地址
+  metadataUrl: string;
+  minZoom?: number;
+  maxZoom?: number;
+  tileSize?: number;
+  zoomOffset?: number;
+  extent?: [number, number, number, number];
+};
+
+/**
+ * 矢量瓦片数据源类型
+ */
+export type VectorTileDatasetSchema = BaseDataset & {
+  type: 'vector-tile';
+  // 瓦片服务配置
+  properties: MVTVectorTileProperties;
 };
 
 /**

diff --git a/packages/li-sdk/src/specs/layer.ts b/packages/li-sdk/src/specs/layer.ts
@@ -25,7 +25,7 @@ export type LayerSourceConfig = {
   datasetId: string;
   /** 数据解析配置项，对应 L7 的 source.parser */
   parser: {
-    type: string;
+    type?: string;
     x?: string;
     y?: string;
     x1?: string;
@@ -46,6 +46,7 @@ export type LayerSchema = {
   type: string;
   /** 图层信息，用于存储图层元数据信息 */
   metadata: Metadata;
+  // TODO: type is required
   /** 数据集配置，用于关联数据集 */
   sourceConfig?: LayerSourceConfig;
   /** 图层可视化配置项，对应 LarkMap 图层组件的 Props 属性 */