Merge branch 'master' into react

examples/line/arc/demo/arcCircle.js

@@ -27,8 +27,7 @@ fetch('https://gw.alipayobjects.com/os/rmsportal/UEXQMifxtkQlYfChpPwT.txt')
       .shape('greatcircle')
       .color('#8C1EB2')
       .style({
-        opacity: 0.8,
+        opacity: 0.8
-        blur: 0.99
       });
     scene.addLayer(layer);
   });

lerna.json

@@ -14,7 +14,7 @@
       "message": "chore: publish"
     }
   },
-  "version": "2.0.18",
+  "version": "2.0.19",
   "npmClient": "yarn",
   "useWorkspaces": true,
   "publishConfig": {

package.json

@@ -119,7 +119,7 @@
   "scripts": {
     "start": "yarn run site:clean && yarn run site:develop",
     "site:develop": "cross-env BABEL_ENV=site gatsby develop --open -H 0.0.0.0",
-    "site:build": "yarn run site:clean && cross-env BABEL_ENV=site gatsby build --prefix-paths --no-uglify",
+    "site:build": "yarn run site:clean && cross-env BABEL_ENV=site gatsby build --prefix-paths",
     "site:clean": "gatsby clean",
     "site:deploy": "yarn run site:build && gh-pages -d public",
     "site:publish": "gh-pages -d public",

packages/component/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-component",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -24,8 +24,8 @@
   "author": "lzxue",
   "license": "ISC",
   "dependencies": {
-    "@antv/l7-core": "^2.0.18",
+    "@antv/l7-core": "^2.0.19",
-    "@antv/l7-utils": "^2.0.18",
+    "@antv/l7-utils": "^2.0.19",
     "@babel/runtime": "^7.7.7",
     "eventemitter3": "^4.0.0",
     "inversify": "^5.0.1",

packages/component/src/marker.ts

@@ -252,32 +252,32 @@ export default class Marker extends EventEmitter {
     element.addEventListener('click', (e: MouseEvent) => {
       this.onMapClick(e);
     });
-    element.addEventListener('click', this.eventHander);
+    element.addEventListener('click', this.eventHandle);
     applyAnchorClass(element, anchor, 'marker');
   }
   private registerMarkerEvent(element: HTMLElement) {
-    element.addEventListener('mousemove', this.eventHander);
+    element.addEventListener('mousemove', this.eventHandle);
-    element.addEventListener('click', this.eventHander);
+    element.addEventListener('click', this.eventHandle);
-    element.addEventListener('mousedown', this.eventHander);
+    element.addEventListener('mousedown', this.eventHandle);
-    element.addEventListener('mouseup', this.eventHander);
+    element.addEventListener('mouseup', this.eventHandle);
-    element.addEventListener('dblclick', this.eventHander);
+    element.addEventListener('dblclick', this.eventHandle);
-    element.addEventListener('contextmenu', this.eventHander);
+    element.addEventListener('contextmenu', this.eventHandle);
-    element.addEventListener('mouseover', this.eventHander);
+    element.addEventListener('mouseover', this.eventHandle);
-    element.addEventListener('mouseout', this.eventHander);
+    element.addEventListener('mouseout', this.eventHandle);
   }
   private unRegisterMarkerEvent() {
     const element = this.getElement();
-    element.removeEventListener('mousemove', this.eventHander);
+    element.removeEventListener('mousemove', this.eventHandle);
-    element.removeEventListener('click', this.eventHander);
+    element.removeEventListener('click', this.eventHandle);
-    element.removeEventListener('mousedown', this.eventHander);
+    element.removeEventListener('mousedown', this.eventHandle);
-    element.removeEventListener('mouseup', this.eventHander);
+    element.removeEventListener('mouseup', this.eventHandle);
-    element.removeEventListener('dblclick', this.eventHander);
+    element.removeEventListener('dblclick', this.eventHandle);
-    element.removeEventListener('contextmenu', this.eventHander);
+    element.removeEventListener('contextmenu', this.eventHandle);
-    element.removeEventListener('mouseover', this.eventHander);
+    element.removeEventListener('mouseover', this.eventHandle);
-    element.removeEventListener('mouseout', this.eventHander);
+    element.removeEventListener('mouseout', this.eventHandle);
   }
 
-  private eventHander = (e: MouseEvent) => {
+  private eventHandle = (e: MouseEvent) => {
     this.emit(e.type, {
       target: e,
       data: this.markerOption.extData,

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-core",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -22,7 +22,7 @@
   "author": "xiaoiver",
   "license": "ISC",
   "dependencies": {
-    "@antv/l7-utils": "^2.0.18",
+    "@antv/l7-utils": "^2.0.19",
     "@babel/runtime": "^7.7.7",
     "@mapbox/tiny-sdf": "^1.1.1",
     "ajv": "^6.10.2",

packages/core/src/services/layer/ILayerService.ts

@@ -165,10 +165,10 @@ export interface ILayer {
   /**
    * 事件
    */
-  on(type: string, hander: (...args: any[]) => void): void;
+  on(type: string, handler: (...args: any[]) => void): void;
-  off(type: string, hander: (...args: any[]) => void): void;
+  off(type: string, handler: (...args: any[]) => void): void;
-  emit(type: string, hander: unknown): void;
+  emit(type: string, handler: unknown): void;
-  once(type: string, hander: (...args: any[]) => void): void;
+  once(type: string, handler: (...args: any[]) => void): void;
   /**
    * JSON Schema 用于校验配置项
    */

packages/core/src/services/map/IMapService.ts

@@ -121,6 +121,8 @@ export interface IMapConfig<RawMap = {}> {
   maxZoom?: number;
 
   attributionControl?: boolean;
+
+  [key: string]: any;
 }
 
 /**

packages/core/src/services/renderer/passes/PixelPickingPass.ts

@@ -75,11 +75,11 @@ export default class PixelPickingPass<
     this.interactionService.on(InteractionEvent.Hover, this.pickFromPickingFBO);
     this.interactionService.on(
       InteractionEvent.Select,
-      this.selectFeatureHander.bind(this),
+      this.selectFeatureHandle.bind(this),
     );
     this.interactionService.on(
       InteractionEvent.Active,
-      this.highlightFeatureHander.bind(this),
+      this.highlightFeatureHandle.bind(this),
     );
   }
 
@@ -259,12 +259,12 @@ export default class PixelPickingPass<
     this.layerService.renderLayers();
   }
 
-  private selectFeatureHander({ featureId }: Partial<IInteractionTarget>) {
+  private selectFeatureHandle({ featureId }: Partial<IInteractionTarget>) {
     const pickedColors = encodePickingColor(featureId as number);
     this.selectFeature(new Uint8Array(pickedColors));
   }
 
-  private highlightFeatureHander({ featureId }: Partial<IInteractionTarget>) {
+  private highlightFeatureHandle({ featureId }: Partial<IInteractionTarget>) {
     const pickedColors = encodePickingColor(featureId as number);
     this.highlightPickedFeature(new Uint8Array(pickedColors));
   }

packages/core/src/services/scene/ISceneService.ts

@@ -3,8 +3,8 @@ import { IMapConfig } from '../map/IMapService';
 import { IRenderConfig } from '../renderer/IRendererService';
 
 export interface ISceneService {
-  on(type: string, hander: (...args: any[]) => void): void;
+  on(type: string, handle: (...args: any[]) => void): void;
-  off(type: string, hander: (...args: any[]) => void): void;
+  off(type: string, handle: (...args: any[]) => void): void;
   removeAllListeners(event?: string): this;
   init(config: IMapConfig & IRenderConfig): void;
   addLayer(layer: ILayer): void;

packages/l7/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "A Large-scale WebGL-powered Geospatial Data Visualization",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -24,11 +24,11 @@
   "author": "antv",
   "license": "MIT",
   "dependencies": {
-    "@antv/l7-component": "^2.0.18",
+    "@antv/l7-component": "^2.0.19",
-    "@antv/l7-core": "^2.0.18",
+    "@antv/l7-core": "^2.0.19",
-    "@antv/l7-layers": "^2.0.18",
+    "@antv/l7-layers": "^2.0.19",
-    "@antv/l7-maps": "^2.0.18",
+    "@antv/l7-maps": "^2.0.19",
-    "@antv/l7-scene": "^2.0.18",
+    "@antv/l7-scene": "^2.0.19",
     "@babel/runtime": "^7.7.7"
   },
   "gitHead": "f2bd3c6473df79d815467b1677c6f985cf68800e",

packages/layers/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-layers",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "L7's collection of built-in layers",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -22,9 +22,9 @@
   "author": "xiaoiver",
   "license": "ISC",
   "dependencies": {
-    "@antv/l7-core": "^2.0.18",
+    "@antv/l7-core": "^2.0.19",
-    "@antv/l7-source": "^2.0.18",
+    "@antv/l7-source": "^2.0.19",
-    "@antv/l7-utils": "^2.0.18",
+    "@antv/l7-utils": "^2.0.19",
     "@babel/runtime": "^7.7.7",
     "@mapbox/martini": "^0.1.0",
     "@turf/meta": "^6.0.2",

packages/layers/src/line/models/arc.ts

@@ -12,7 +12,7 @@ import BaseModel from '../../core/BaseModel';
 import { ILineLayerStyleOptions, lineStyleType } from '../../core/interface';
 import { LineArcTriangulation } from '../../core/triangulation';
 import line_arc_frag from '../shaders/line_arc_frag.glsl';
-import line_arc2d_vert from '../shaders/line_bezier_vert.glsl';
+import line_arc2d_vert from '../shaders/line_arc_vert.glsl';
 const lineStyleObj: { [key: string]: number } = {
   solid: 0.0,
   dash: 1.0,

packages/layers/src/line/models/arc_3d.ts

@@ -10,8 +10,8 @@ import {
 import BaseModel from '../../core/BaseModel';
 import { ILineLayerStyleOptions, lineStyleType } from '../../core/interface';
 import { LineArcTriangulation } from '../../core/triangulation';
+import line_arc_vert from '../shaders/line_arc_3d_vert.glsl';
 import line_arc_frag from '../shaders/line_arc_frag.glsl';
-import line_arc_vert from '../shaders/line_arc_vert.glsl';
 const lineStyleObj: { [key: string]: number } = {
   solid: 0.0,
   dash: 1.0,

packages/layers/src/line/models/great_circle.ts

@@ -11,8 +11,8 @@ import {
 import BaseModel from '../../core/BaseModel';
 import { ILineLayerStyleOptions, lineStyleType } from '../../core/interface';
 import { LineArcTriangulation } from '../../core/triangulation';
-import line_arc2d_vert from '../shaders/line_arc2d_vert.glsl';
 import line_arc_frag from '../shaders/line_arc_frag.glsl';
+import line_arc2d_vert from '../shaders/line_arc_great_circle_vert.glsl';
 const lineStyleObj: { [key: string]: number } = {
   solid: 0.0,
   dash: 1.0,

packages/layers/src/line/shaders/line_arc_3d_vert.glsl

@@ -0,0 +1,91 @@
+#define LineTypeSolid 0.0
+#define LineTypeDash 1.0
+#define Animate 0.0
+attribute vec3 a_Position;
+attribute vec4 a_Instance;
+attribute vec4 a_Color;
+attribute float a_Size;
+
+uniform mat4 u_ModelMatrix;
+uniform float segmentNumber;
+uniform vec4 u_aimate: [ 0, 2., 1.0, 0.2 ];
+varying vec4 v_color;
+varying vec2 v_normal;
+varying float v_distance_ratio;
+uniform float u_line_type: 0.0;
+uniform vec2 u_dash_array: [10.0, 5.];
+
+varying vec2 v_dash_array;
+
+#pragma include "projection"
+#pragma include "project"
+#pragma include "picking"
+
+float maps (float value, float start1, float stop1, float start2, float stop2) {
+  return start2 + (stop2 - start2) * ((value - start1) / (stop1 - start1));
+}
+
+float getSegmentRatio(float index) {
+  return smoothstep(0.0, 1.0, index / (segmentNumber - 1.0));
+}
+
+float paraboloid(vec2 source, vec2 target, float ratio) {
+  vec2 x = mix(source, target, ratio);
+  vec2 center = mix(source, target, 0.5);
+  float dSourceCenter = distance(source, center);
+  float dXCenter = distance(x, center);
+  return (dSourceCenter + dXCenter) * (dSourceCenter - dXCenter);
+}
+
+vec3 getPos(vec2 source, vec2 target, float segmentRatio) {
+  float vertex_height = paraboloid(source, target, segmentRatio);
+
+  return vec3(
+    mix(source, target, segmentRatio),
+    sqrt(max(0.0, vertex_height))
+  );
+}
+vec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {
+  // normalized direction of the line
+  vec2 dir_screenspace = normalize(line_clipspace);
+  // rotate by 90 degrees
+  dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);
+
+  vec2 offset = dir_screenspace * offset_direction * a_Size / 2.0;
+
+  return offset;
+}
+vec2 getNormal(vec2 line_clipspace, float offset_direction) {
+  // normalized direction of the line
+  vec2 dir_screenspace = normalize(line_clipspace);
+  // rotate by 90 degrees
+  dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);
+  return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);
+}
+
+void main() {
+  v_color = a_Color;
+  vec2 source = project_position(vec4(a_Instance.rg, 0, 0)).xy;
+  vec2 target = project_position(vec4(a_Instance.ba, 0, 0)).xy;
+  float segmentIndex = a_Position.x;
+  float segmentRatio = getSegmentRatio(segmentIndex);
+  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));
+
+   if(u_line_type == LineTypeDash) {
+    v_distance_ratio = segmentIndex / segmentNumber;
+    float total_Distance = pixelDistance(a_Instance.rg, a_Instance.ba) / 2.0 * PI;
+    v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / (total_Distance / segmentNumber * segmentIndex);
+  }
+    if(u_aimate.x == Animate) {
+      v_distance_ratio = segmentIndex / segmentNumber;
+  }
+
+  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);
+  vec3 curr = getPos(source, target, segmentRatio);
+  vec3 next = getPos(source, target, nextSegmentRatio);
+  vec2 offset = getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y);
+  v_normal = getNormal((next.xy - curr.xy) * indexDir, a_Position.y);
+
+  gl_Position = project_common_position_to_clipspace(vec4(curr.xy + project_pixel(offset), curr.z, 1.0));
+  setPickingColor(a_PickingColor);
+}

packages/layers/src/line/shaders/line_arc_frag.glsl

@@ -18,7 +18,7 @@ uniform vec4 u_aimate: [ 0, 2., 1.0, 0.2 ];
 void main() {
   gl_FragColor = v_color;
   float blur = 1.- smoothstep(u_blur, 1., length(v_normal.xy));
-  gl_FragColor.a *= (blur * u_opacity);
+  gl_FragColor.a *= u_opacity * blur;
   if(u_line_type == LineTypeDash) {
     gl_FragColor.a *= blur  * (1.0- step(v_dash_array.x, mod(v_distance_ratio, v_dash_array.x +v_dash_array.y)));
   }

packages/layers/src/line/shaders/line_arc_great_circle_vert.glsl

@@ -50,7 +50,7 @@ vec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {
   // rotate by 90 degrees
    dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);
   vec2 offset = dir_screenspace * offset_direction * a_Size / 2.0;
-  return offset * vec2(1.0, -1.0);
+  return offset;
 }
 vec2 getNormal(vec2 line_clipspace, float offset_direction) {
   // normalized direction of the line

packages/layers/src/line/shaders/line_arc_vert.glsl

@@ -1,58 +1,54 @@
 #define LineTypeSolid 0.0
 #define LineTypeDash 1.0
 #define Animate 0.0
+attribute vec4 a_Color;
 attribute vec3 a_Position;
 attribute vec4 a_Instance;
-attribute vec4 a_Color;
 attribute float a_Size;
-
 uniform mat4 u_ModelMatrix;
 uniform float segmentNumber;
 uniform vec4 u_aimate: [ 0, 2., 1.0, 0.2 ];
 varying vec4 v_color;
 varying vec2 v_normal;
+
 varying float v_distance_ratio;
 uniform float u_line_type: 0.0;
 uniform vec2 u_dash_array: [10.0, 5.];
-
 varying vec2 v_dash_array;
-
 #pragma include "projection"
 #pragma include "project"
 #pragma include "picking"
 
-float maps (float value, float start1, float stop1, float start2, float stop2) {
+float bezier3(vec3 arr, float t) {
-  return start2 + (stop2 - start2) * ((value - start1) / (stop1 - start1));
+  float ut = 1. - t;
+  return (arr.x * ut + arr.y * t) * ut + (arr.y * ut + arr.z * t) * t;
+}
+vec2 midPoint(vec2 source, vec2 target) {
+  vec2 center = target - source;
+  float r = length(center);
+  float theta = atan(center.y, center.x);
+  float thetaOffset = 0.314;
+  float r2 = r / 2.0 / cos(thetaOffset);
+  float theta2 = theta + thetaOffset;
+  vec2 mid = vec2(r2*cos(theta2) + source.x, r2*sin(theta2) + source.y);
+  return mid;
 }
-
 float getSegmentRatio(float index) {
-  return smoothstep(0.0, 1.0, index / (segmentNumber - 1.0));
+    return smoothstep(0.0, 1.0, index / (segmentNumber - 1.));
 }
-
+vec2 interpolate (vec2 source, vec2 target, float t) {
-float paraboloid(vec2 source, vec2 target, float ratio) {
+  // if the angularDist is PI, linear interpolation is applied. otherwise, use spherical interpolation
-  vec2 x = mix(source, target, ratio);
+  vec2 mid = midPoint(source, target);
-  vec2 center = mix(source, target, 0.5);
+  vec3 x = vec3(source.x, mid.x, target.x);
-  float dSourceCenter = distance(source, center);
+  vec3 y = vec3(source.y, mid.y, target.y);
-  float dXCenter = distance(x, center);
+  return vec2(bezier3(x ,t), bezier3(y,t));
-  return (dSourceCenter + dXCenter) * (dSourceCenter - dXCenter);
-}
-
-vec3 getPos(vec2 source, vec2 target, float segmentRatio) {
-  float vertex_height = paraboloid(source, target, segmentRatio);
-
-  return vec3(
-    mix(source, target, segmentRatio),
-    sqrt(max(0.0, vertex_height))
-  );
 }
 vec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {
   // normalized direction of the line
   vec2 dir_screenspace = normalize(line_clipspace);
   // rotate by 90 degrees
    dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);
-
   vec2 offset = dir_screenspace * offset_direction * a_Size / 2.0;
-
   return offset;
 }
 vec2 getNormal(vec2 line_clipspace, float offset_direction) {
@@ -65,12 +61,12 @@ vec2 getNormal(vec2 line_clipspace, float offset_direction) {
 
 void main() {
   v_color = a_Color;
-  vec2 source = project_position(vec4(a_Instance.rg, 0, 0)).xy;
+  vec2 source = a_Instance.rg;
-  vec2 target = project_position(vec4(a_Instance.ba, 0, 0)).xy;
+  vec2 target =  a_Instance.ba;
   float segmentIndex = a_Position.x;
   float segmentRatio = getSegmentRatio(segmentIndex);
   float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));
-
+  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);
   if(u_line_type == LineTypeDash) {
       v_distance_ratio = segmentIndex / segmentNumber;
       float total_Distance = pixelDistance(a_Instance.rg, a_Instance.ba) / 2.0 * PI;
@@ -79,13 +75,11 @@ void main() {
   if(u_aimate.x == Animate) {
       v_distance_ratio = segmentIndex / segmentNumber;
   }
-
+  vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio), 0.0, 1.0));
-  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);
+  vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio), 0.0, 1.0));
-  vec3 curr = getPos(source, target, segmentRatio);
-  vec3 next = getPos(source, target, nextSegmentRatio);
-  vec2 offset = getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y);
   v_normal = getNormal((next.xy - curr.xy) * indexDir, a_Position.y);
+  vec2 offset = project_pixel(getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y));
 
-  gl_Position = project_common_position_to_clipspace(vec4(curr.xy + project_pixel(offset), curr.z, 1.0));
+  gl_Position = project_common_position_to_clipspace(vec4(curr.xy + offset, 0, 1.0));
   setPickingColor(a_PickingColor);
 }

packages/layers/src/line/shaders/line_bezier_vert.glsl

@@ -1,85 +0,0 @@
-#define LineTypeSolid 0.0
-#define LineTypeDash 1.0
-#define Animate 0.0
-attribute vec4 a_Color;
-attribute vec3 a_Position;
-attribute vec4 a_Instance;
-attribute float a_Size;
-uniform mat4 u_ModelMatrix;
-uniform float segmentNumber;
-uniform vec4 u_aimate: [ 0, 2., 1.0, 0.2 ];
-varying vec4 v_color;
-varying vec2 v_normal;
-
-varying float v_distance_ratio;
-uniform float u_line_type: 0.0;
-uniform vec2 u_dash_array: [10.0, 5.];
-varying vec2 v_dash_array;
-#pragma include "projection"
-#pragma include "project"
-#pragma include "picking"
-
-float bezier3(vec3 arr, float t) {
-  float ut = 1. - t;
-  return (arr.x * ut + arr.y * t) * ut + (arr.y * ut + arr.z * t) * t;
-}
-vec2 midPoint(vec2 source, vec2 target) {
-  vec2 center = target - source;
-  float r = length(center);
-  float theta = atan(center.y, center.x);
-  float thetaOffset = 0.314;
-  float r2 = r / 2.0 / cos(thetaOffset);
-  float theta2 = theta + thetaOffset;
-  vec2 mid = vec2(r2*cos(theta2) + source.x, r2*sin(theta2) + source.y);
-  return mid;
-}
-float getSegmentRatio(float index) {
-    return smoothstep(0.0, 1.0, index / (segmentNumber - 1.));
-}
-vec2 interpolate (vec2 source, vec2 target, float t) {
-  // if the angularDist is PI, linear interpolation is applied. otherwise, use spherical interpolation
-  vec2 mid = midPoint(source, target);
-  vec3 x = vec3(source.x, mid.x, target.x);
-  vec3 y = vec3(source.y, mid.y, target.y);
-  return vec2(bezier3(x ,t), bezier3(y,t));
-}
-vec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {
-  // normalized direction of the line
-  vec2 dir_screenspace = normalize(line_clipspace);
-  // rotate by 90 degrees
-   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);
-  vec2 offset = dir_screenspace * offset_direction * a_Size / 2.0;
-  return offset * vec2(1.0, -1.0);
-}
-vec2 getNormal(vec2 line_clipspace, float offset_direction) {
-  // normalized direction of the line
-  vec2 dir_screenspace = normalize(line_clipspace);
-  // rotate by 90 degrees
-   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);
-   return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);
-}
-
-void main() {
-  v_color = a_Color;
-  vec2 source = a_Instance.rg;
-  vec2 target =  a_Instance.ba;
-  float segmentIndex = a_Position.x;
-  float segmentRatio = getSegmentRatio(segmentIndex);
-  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));
-  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);
-  if(u_line_type == LineTypeDash) {
-      v_distance_ratio = segmentIndex / segmentNumber;
-      float total_Distance = pixelDistance(a_Instance.rg, a_Instance.ba) / 2.0 * PI;
-      v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / (total_Distance / segmentNumber * segmentIndex);
-    }
-  if(u_aimate.x == Animate) {
-      v_distance_ratio = segmentIndex / segmentNumber;
-  }
-  vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio), 0.0, 1.0));
-  vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio), 0.0, 1.0));
-  v_normal = getNormal((next.xy - curr.xy) * indexDir, a_Position.y);
-  vec2 offset = project_pixel(getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y));
-
-  gl_Position = project_common_position_to_clipspace(vec4(curr.xy + offset, 0, 1.0));
-  setPickingColor(a_PickingColor);
-}

packages/maps/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-maps",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -23,8 +23,8 @@
   "author": "xiaoiver",
   "license": "ISC",
   "dependencies": {
-    "@antv/l7-core": "^2.0.18",
+    "@antv/l7-core": "^2.0.19",
-    "@antv/l7-utils": "^2.0.18",
+    "@antv/l7-utils": "^2.0.19",
     "@babel/runtime": "^7.7.7",
     "gl-matrix": "^3.1.0",
     "inversify": "^5.0.1",

packages/renderer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-renderer",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -25,7 +25,7 @@
     "gl": "^4.4.0"
   },
   "dependencies": {
-    "@antv/l7-core": "^2.0.18",
+    "@antv/l7-core": "^2.0.19",
     "@babel/runtime": "^7.7.7",
     "inversify": "^5.0.1",
     "lodash": "^4.17.15",

packages/scene/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-scene",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -22,11 +22,11 @@
   "author": "xiaoiver",
   "license": "ISC",
   "dependencies": {
-    "@antv/l7-component": "^2.0.18",
+    "@antv/l7-component": "^2.0.19",
-    "@antv/l7-core": "^2.0.18",
+    "@antv/l7-core": "^2.0.19",
-    "@antv/l7-maps": "^2.0.18",
+    "@antv/l7-maps": "^2.0.19",
-    "@antv/l7-renderer": "^2.0.18",
+    "@antv/l7-renderer": "^2.0.19",
-    "@antv/l7-utils": "^2.0.18",
+    "@antv/l7-utils": "^2.0.19",
     "@babel/runtime": "^7.7.7",
     "inversify": "^5.0.1",
     "mapbox-gl": "^1.2.1",

packages/source/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-source",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -24,8 +24,8 @@
   "author": "lzxue",
   "license": "ISC",
   "dependencies": {
-    "@antv/l7-core": "^2.0.18",
+    "@antv/l7-core": "^2.0.19",
-    "@antv/l7-utils": "^2.0.18",
+    "@antv/l7-utils": "^2.0.19",
     "@babel/runtime": "^7.7.7",
     "@mapbox/geojson-rewind": "^0.4.0",
     "@turf/helpers": "^6.1.4",

packages/utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-utils",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",

stories/Layers/components/Arc2DLine.tsx

@@ -23,28 +23,28 @@ export default class Arc2DLineDemo extends React.Component {
         zoom: 2,
       }),
     });
-    const lineLayer = new LineLayer()
+    const lineLayer = new LineLayer({
+      blend: 'normal',
+    })
       .source(await response.text(), {
         parser: {
           type: 'csv',
-          x: 'lng1',
+          x1: 'lng1',
-          y: 'lat1',
+          y1: 'lat1',
-          x1: 'lng2',
+          x: 'lng2',
-          y1: 'lat2',
+          y: 'lat2',
         },
       })
-      .size(4)
+      .size(3)
-      .shape('greatcircle')
+      .shape('arc')
-      .color('rgb(13,64,140)')
+      .color('#8C1EB2')
-      .animate({
-        interval: 0.5,
-        duration: 2,
-        trailLength: 0.4,
-      })
       .style({
-        opacity: 0.1,
+        opacity: 1,
       });
     scene.addLayer(lineLayer);
+    lineLayer.on('click', (e) => {
+      console.log(e);
+    });
     scene.render();
     this.scene = scene;
   }