fix(demo): bugs

antvis · Nov 14, 2019 · 5a857f9 · 5a857f9
1 parent b6a1785
commit 5a857f9
Show file tree

Hide file tree

Showing 30 changed files with 287 additions and 86 deletions.
diff --git a/examples/heatmap/grid/demo/meta.json b/examples/heatmap/grid/demo/meta.json
@@ -6,11 +6,13 @@
   "demos": [
     {
       "filename": "grid.js",
-      "title": "网格热力图"
+      "title": "网格热力图",
+      "screenshot":""
     },
     {
       "filename": "world.js",
-      "title": "世界电厂热力图"
+      "title": "世界电厂热力图",
+      "screenshot":""
     }
   ]
 }
diff --git a/examples/heatmap/heatmap/demo/meta.json b/examples/heatmap/heatmap/demo/meta.json
@@ -6,11 +6,13 @@
   "demos": [
     {
       "filename": "world3d.js",
-      "title": "经典热力图3D"
+      "title": "经典热力图3D",
+      "screenshot":"https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*NxFPSrd9oscAAAAAAAAAAABkARQnAQ"
     },
     {
       "filename": "world.js",
-      "title": "经典热力图2D"
+      "title": "经典热力图2D",
+      "screenshot":"https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*9zUcSK07PHgAAAAAAAAAAABkARQnAQ"
     }
   ]
 }
diff --git a/examples/heatmap/heatmap/demo/world.js b/examples/heatmap/heatmap/demo/world.js
@@ -4,11 +4,10 @@ const scene = new Scene({
   id: 'map',
   style: 'dark',
   pitch: 0,
-  center: [103.693879, 34.38704],
+  center: [127.5671666579043,7.445038892195569],
   type: 'mapbox',
-  zoom: 3.69,
+  zoom: 2.632456779444394
 });
-
 fetch('https://gw.alipayobjects.com/os/basement_prod/d3564b06-670f-46ea-8edb-842f7010a7c6.json')
   .then((res) => res.json())
   .then((data) => {
@@ -21,7 +20,7 @@ fetch('https://gw.alipayobjects.com/os/basement_prod/d3564b06-670f-46ea-8edb-842
           radius: 20,
           opacity: 1.0,
           rampColors: {
-            colors: ['#2E8AE6', '#69D1AB', '#DAF291', '#FFD591', '#FF7A45', '#CF1D49'],
+            colors: [ '#FF4818', '#F7B74A', '#FFF598', '#91EABC', '#2EA9A1', '#206C7C' ].reverse(),
             positions: [0, 0.2, 0.4, 0.6, 0.8, 1.0]
           }
         })

diff --git a/examples/heatmap/heatmap/demo/world3d.js b/examples/heatmap/heatmap/demo/world3d.js
@@ -24,7 +24,7 @@ fetch('https://gw.alipayobjects.com/os/basement_prod/337ddbb7-aa3f-4679-ab60-d64
         radius: 5,
         opacity: 1.0,
         rampColors: {
-          colors: [
+          colors:[
             '#2E8AE6',
             '#69D1AB',
             '#DAF291',

diff --git a/examples/heatmap/hexagon/demo/light.js b/examples/heatmap/hexagon/demo/light.js
@@ -65,9 +65,15 @@ const colorObj = {
     '#5B8EF8', '#FCF6FA',
     '#F5E4EF', '#F7CDDF',
     '#ED9CBE', '#D1749B'
-  ]
+  ],
+  color4: [ '#421EB2', '#8C1EB2', '#F27DEB', '#FFF598', '#F7B74A', '#FF4818' ],
+  colors6: [ '#FBE0B2', '#F6BB91', '#F88E8B', '#5C6CE5', '#110A6C', '#0D0943' ],
+  colors5: [ '#F86A7E', '#F79794', '#D0A8AD', '#8596A4', '#0D7D9E', '#07485B' ],
+  colors11: [ '#005F6D', '#0F9EA3', '#B9CDC5', '#DF881C', '#AE571E', '#6C2C03' ],
+  colors7: [ '#D66A74', '#EF808B', '#F09FAF', '#B1C987', '#789676', '#636C58' ],
+  colors8: [ '#5E023A', '#C52C6A', '#F0C4E8', '#F7CAB8', '#7EBCA9', '#117D8D' ],
+  colors9: [ '#FF4818', '#F7B74A', '#FFF598', '#91EABC', '#2EA9A1', '#206C7C' ]
 }
-
 fetch(
   'https://gw.alipayobjects.com/os/basement_prod/a1a8158d-6fe3-424b-8e50-694ccf61c4d7.csv',
 )

diff --git a/examples/line/arc/demo/arc.js b/examples/line/arc/demo/arc.js
@@ -5,7 +5,7 @@ const scene = new Scene({
   pitch: 0,
   type: 'mapbox',
   style: 'dark',
-  center: [102.602992, 23.107329],
+  center: [0., 23.107329],
   zoom: 0,
 });
 

diff --git a/examples/line/arc/demo/meta.json b/examples/line/arc/demo/meta.json
@@ -11,13 +11,14 @@
 
     },
     {
-      "filename": "arcCircle.js",
-      "title": "大圆弧线"
-
+      "filename": "arc.js",
+      "title": "弧线",
+      "screenshot": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*gdcqTa6UCsYAAAAAAAAAAABkARQnAQ"
     },
     {
-      "filename": "arc.js",
-      "title": "弧线"
+      "filename": "arcCircle.js",
+      "title": "大圆弧线",
+      "screenshot": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*gdcqTa6UCsYAAAAAAAAAAABkARQnAQ"
 
     }
   ]

diff --git a/examples/line/line/demo/ele.js b/examples/line/line/demo/ele.js
@@ -0,0 +1,42 @@
+import { Scene } from '@l7/scene';
+import { LineLayer } from '@l7/layers'
+const scene = new Scene({
+  id: 'map',
+  pitch: 0,
+  type: 'amap',
+  style: 'light',
+  center: [102.602992, 23.107329],
+  zoom: 14,
+});
+
+fetch('https://gw.alipayobjects.com/os/rmsportal/ZVfOvhVCzwBkISNsuKCc.json')
+  .then((res) => res.json())
+  .then((data) => {
+    const layer =
+      new LineLayer({
+      })
+        .source(data)
+        .size('ELEV', (h) => {
+          return [h % 50 === 0 ? 1.0 : 0.5, (h -1300) *20 ];
+        })
+        .shape('line')
+        .scale('ELEV', {
+          type: 'quantize'
+        })
+        .color(
+          'ELEV',
+          [ '#E4682F',
+            '#FF8752',
+            '#FFA783',
+            '#FFBEA8',
+            '#FFDCD6',
+            '#EEF3FF',
+            '#C8D7F5',
+            '#A5C1FC',
+            '#7FA7F9',
+            '#5F8AE5' ].reverse()
+        )
+    scene.addLayer(layer);
+    console.log(layer);
+
+  });
diff --git a/examples/line/line/demo/ele_dark.js b/examples/line/line/demo/ele_dark.js
@@ -0,0 +1,42 @@
+import { Scene } from '@l7/scene';
+import { LineLayer } from '@l7/layers'
+const scene = new Scene({
+  id: 'map',
+  pitch: 0,
+  type: 'amap',
+  style: 'dark',
+  center: [102.602992, 23.107329],
+  zoom: 14,
+});
+
+fetch('https://gw.alipayobjects.com/os/rmsportal/ZVfOvhVCzwBkISNsuKCc.json')
+  .then((res) => res.json())
+  .then((data) => {
+    const layer =
+      new LineLayer({
+      })
+        .source(data)
+        .size('ELEV', (h) => {
+          return [h % 50 === 0 ? 1.0 : 0.5, (h -1300) *20 ];
+        })
+        .shape('line')
+        .scale('ELEV', {
+          type: 'quantize'
+        })
+        .color(
+          'ELEV',
+          [ '#E4682F',
+            '#FF8752',
+            '#FFA783',
+            '#FFBEA8',
+            '#FFDCD6',
+            '#EEF3FF',
+            '#C8D7F5',
+            '#A5C1FC',
+            '#7FA7F9',
+            '#5F8AE5' ].reverse()
+        )
+    scene.addLayer(layer);
+    console.log(layer);
+
+  });
diff --git a/examples/line/line/demo/linedash.js b/examples/line/line/demo/linedash.js
@@ -0,0 +1,28 @@
+import { Scene } from '@l7/scene';
+import { LineLayer } from '@l7/layers'
+const scene = new Scene({
+  id: 'map',
+  pitch: 0,
+  type: 'amap',
+  style: 'light',
+  center: [102.602992, 33.107329],
+  zoom: 3.5,
+});
+
+fetch('https://gw.alipayobjects.com/os/basement_prod/9f6afbcd-3aec-4a26-bd4a-2276d3439e0d.json')
+  .then((res) => res.json())
+  .then((data) => {
+    const layer =
+      new LineLayer({
+      })
+        .source(data)
+        .scale('value',{
+          type: 'quantile'
+        })
+        .size('value', [0.5, 1, 1.5, 2])
+        .shape('line')
+        .color('value', ['#FFF2E8', '#FFCEA7', '#F0A66C', '#CC464B', '#8A191A'])
+    scene.addLayer(layer);
+    console.log(layer);
+
+  });
diff --git a/examples/line/line/demo/meta.json b/examples/line/line/demo/meta.json
@@ -0,0 +1,24 @@
+{
+  "title": {
+    "zh": "线图层",
+    "en": "line"
+  },
+  "demos": [
+    {
+      "filename": "ele.js",
+      "title": "等高线",
+      "screenshot":"https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*FGliTJ7eSBIAAAAAAAAAAABkARQnAQ"
+    },
+    {
+      "filename": "ele_dark.js",
+      "title": "等高线",
+      "screenshot":""
+    },
+    {
+      "filename": "linedash.js",
+      "title": "等高线",
+      "screenshot":""
+    }
+
+  ]
+}
diff --git a/examples/line/line/index.zh.md b/examples/line/line/index.zh.md
@@ -0,0 +1,6 @@
+---
+title: 等值线
+order: 0
+redirect_from:
+  - /zh/examples/line/
+---
diff --git a/examples/point/chartmap/demo/meta.json b/examples/point/chartmap/demo/meta.json
@@ -7,8 +7,8 @@
     {
       "filename": "normal.js",
       "title": "海量点",
-      "screenshot":"https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*Kva7R7AimzsAAAAAAAAAAABkARQnAQ"
-   
+      "screenshot":""
+
     }
   ]
 }
diff --git a/examples/point/scatter/demo/meta.json b/examples/point/scatter/demo/meta.json
@@ -8,7 +8,16 @@
       "filename": "normal.js",
       "title": "海量点",
       "screenshot":"https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*Kva7R7AimzsAAAAAAAAAAABkARQnAQ"
-
+    },
+    {
+      "filename": "scatter.js",
+      "title": "定点图",
+      "screenshot":"https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*s5lpTYp2hZYAAAAAAAAAAABkARQnAQ"
+
     }
+
+
+
+
   ]
 }
diff --git a/examples/point/scatter/demo/scater.js → examples/point/scatter/demo/scatter.js b/examples/point/scatter/demo/scater.js → examples/point/scatter/demo/scatter.js
diff --git a/examples/point/scatter/index.zh.md b/examples/point/scatter/index.zh.md
@@ -1,4 +1,4 @@
 ---
-title: "散点地图"
+title: "等值线"
 order: 1
 ---
diff --git a/packages/core/src/services/layer/StyleAttributeService.ts b/packages/core/src/services/layer/StyleAttributeService.ts
@@ -4,7 +4,7 @@ import { gl } from '../renderer/gl';
 import { IAttribute } from '../renderer/IAttribute';
 import { IElements } from '../renderer/IElements';
 import { IRendererService } from '../renderer/IRendererService';
-import { IParseDataItem } from '../source/ISourceService'
+import { IParseDataItem } from '../source/ISourceService';
 import { ILayer } from './ILayerService';
 import {
   IEncodeFeature,
@@ -216,10 +216,11 @@ export default class StyleAttributeService implements IStyleAttributeService {
       ) {
         descriptors.forEach((descriptor, attributeIdx) => {
           if (descriptor && descriptor.update) {
-            const normal = normalsForCurrentFeature?.slice(
-              vertexIdx * 3,
-              vertexIdx * 3 + 3,
-            )|| [];
+            const normal =
+              normalsForCurrentFeature?.slice(
+                vertexIdx * 3,
+                vertexIdx * 3 + 3,
+              ) || [];
             (descriptor.buffer.data as number[]).push(
               ...descriptor.update(
                 feature,

diff --git a/packages/core/src/services/renderer/passes/PixelPickingPass.ts b/packages/core/src/services/renderer/passes/PixelPickingPass.ts
@@ -24,7 +24,8 @@ function decodePickingColor(color: Uint8Array): number {
  * @see https://github.com/antvis/L7/blob/next/dev-docs/PixelPickingEngine.md
  */
 @injectable()
-export default class PixelPickingPass<InitializationOptions = {}> implements IPass<InitializationOptions> {
+export default class PixelPickingPass<InitializationOptions = {}>
+  implements IPass<InitializationOptions> {
   @lazyInject(TYPES.IRendererService)
   protected readonly rendererService: IRendererService;
 
@@ -132,7 +133,12 @@ export default class PixelPickingPass<InitializationOptions = {}> implements IPa
 
     const xInDevicePixel = x * window.devicePixelRatio;
     const yInDevicePixel = y * window.devicePixelRatio;
-    if (xInDevicePixel > width || xInDevicePixel < 0 || yInDevicePixel > height || yInDevicePixel < 0) {
+    if (
+      xInDevicePixel > width ||
+      xInDevicePixel < 0 ||
+      yInDevicePixel > height ||
+      yInDevicePixel < 0
+    ) {
       return;
     }
 
@@ -214,7 +220,9 @@ export default class PixelPickingPass<InitializationOptions = {}> implements IPa
     const { clear, useFramebuffer } = this.rendererService;
 
     // 先输出到 PostProcessor
-    const readFBO = this.layer.multiPassRenderer.getPostProcessor().getReadFBO();
+    const readFBO = this.layer.multiPassRenderer
+      .getPostProcessor()
+      .getReadFBO();
     this.layer.hooks.beforeRender.call();
     useFramebuffer(readFBO, () => {
       clear({

diff --git a/packages/core/src/shaders/projection.glsl b/packages/core/src/shaders/projection.glsl
@@ -141,10 +141,11 @@ vec4 project_common_position_to_clipspace(vec4 position) {
 
 vec4 unproject_clipspace_to_position(vec4 clipspacePos, mat4 u_InverseViewProjectionMatrix) {
   vec4 pos = u_InverseViewProjectionMatrix * (clipspacePos - u_ViewportCenterProjection);
+
   if (u_CoordinateSystem == COORDINATE_SYSTEM_METER_OFFSET ||
     u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {
     // Needs to be divided with project_uCommonUnitsPerMeter
-    pos.w /= u_PixelsPerMeter.z;
+     pos.w = pos.w / u_PixelsPerMeter.z;
   }
   return pos;
 }
diff --git a/packages/core/src/utils/vertex-compression.ts b/packages/core/src/utils/vertex-compression.ts
@@ -85,7 +85,12 @@ export function packCircleVertex(
     packUint8ToFloat(strokeColor[2], strokeColor[3]),
   ];
 
-  [[-1, -1], [1, -1], [1, 1], [-1, 1]].forEach(([extrudeX, extrudeY]) => {
+  [
+    [-1, -1],
+    [1, -1],
+    [1, 1],
+    [-1, 1],
+  ].forEach(([extrudeX, extrudeY]) => {
     // vec4(
     //   color,
     //   color,