chore(map): point geometry

packages/map/package.json

@@ -37,7 +37,7 @@
   },
   "homepage": "https://github.com/antvis/L7#readme",
   "dependencies": {
-    "@antv/l7-utils": "2.2.11",
+    "@antv/l7-utils": "2.2.14",
     "@mapbox/point-geometry": "^0.1.0",
     "@mapbox/unitbezier": "^0.0.0",
     "eventemitter3": "^4.0.4",

packages/map/src/camera.ts

@@ -1,10 +1,10 @@
 // @ts-ignore
-import Point, { PointLike } from '@mapbox/point-geometry';
 import { EventEmitter } from 'eventemitter3';
 import { merge } from 'lodash';
 import { IPaddingOptions } from './geo/edge_insets';
 import LngLat, { LngLatLike } from './geo/lng_lat';
 import LngLatBounds, { LngLatBoundsLike } from './geo/lng_lat_bounds';
+import Point, { PointLike } from './geo/point';
 import Transform from './geo/transform';
 import { Event } from './handler/events/event';
 import { IMapOptions } from './interface';

packages/map/src/geo/edge_insets.ts

@@ -1,6 +1,6 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
 import { clamp, interpolate } from '../util';
+import Point from './point';
 
 /**
  * An `EdgeInset` object represents screen space padding applied to the edges of the viewport.

packages/map/src/geo/point.ts

@@ -0,0 +1,183 @@
+export type PointLike = [number, number] | Point;
+
+export default class Point {
+  public static convert(a: any) {
+    if (a instanceof Point) {
+      return a;
+    }
+    if (Array.isArray(a)) {
+      return new Point(a[0], a[1]);
+    }
+    return a;
+  }
+  public x: number;
+  public y: number;
+
+  constructor(x: number, y: number) {
+    this.x = x;
+    this.y = y;
+  }
+
+  public clone() {
+    return new Point(this.x, this.y);
+  }
+
+  public _add(p: Point) {
+    this.x += p.x;
+    this.y += p.y;
+    return this;
+  }
+
+  public add(p: Point) {
+    return this.clone()._add(p);
+  }
+
+  public _sub(p: Point) {
+    this.x -= p.x;
+    this.y -= p.y;
+    return this;
+  }
+  public sub(p: Point) {
+    return this.clone()._sub(p);
+  }
+
+  public _multByPoint(p: Point) {
+    this.x *= p.x;
+    this.y *= p.y;
+    return this;
+  }
+
+  public multByPoint(p: Point) {
+    return this.clone()._multByPoint(p);
+  }
+
+  public _divByPoint(p: Point) {
+    this.x /= p.x;
+    this.y /= p.y;
+    return this;
+  }
+  public divByPoint(p: Point) {
+    return this.clone()._divByPoint(p);
+  }
+
+  public _mult(k: number) {
+    this.x *= k;
+    this.y *= k;
+    return this;
+  }
+
+  public mult(k: number) {
+    return this.clone()._mult(k);
+  }
+
+  public _div(k: number) {
+    this.x /= k;
+    this.y /= k;
+    return this;
+  }
+
+  public div(k: number) {
+    return this.clone()._div(k);
+  }
+
+  public _rotate(angle: number) {
+    const cos = Math.cos(angle);
+    const sin = Math.sin(angle);
+    const x = cos * this.x - sin * this.y;
+    const y = sin * this.x + cos * this.y;
+    this.x = x;
+    this.y = y;
+    return this;
+  }
+
+  public rotate(angle: number) {
+    return this.clone()._rotate(angle);
+  }
+
+  public _rotateAround(angle: number, p: Point) {
+    const cos = Math.cos(angle);
+    const sin = Math.sin(angle);
+    const x = p.x + cos * (this.x - p.x) - sin * (this.y - p.y);
+    const y = p.y + sin * (this.x - p.x) + cos * (this.y - p.y);
+    this.x = x;
+    this.y = y;
+    return this;
+  }
+  public roateAround(angle: number, p: Point) {
+    return this.clone()._rotateAround(angle, p);
+  }
+
+  public _matMult(m: number[]) {
+    const x = m[0] * this.x + m[1] * this.y;
+    const y = m[2] * this.x + m[3] * this.y;
+    this.x = x;
+    this.y = y;
+    return this;
+  }
+
+  public matMult(m: number[]) {
+    return this.clone()._matMult(m);
+  }
+
+  public _unit() {
+    this.div(this.mag());
+    return this;
+  }
+  public unit() {
+    return this.clone()._unit();
+  }
+
+  public _perp() {
+    const y = this.y;
+    this.y = this.x;
+    this.x = -y;
+    return this;
+  }
+  public perp() {
+    return this.clone()._perp();
+  }
+
+  public _round() {
+    this.x = Math.round(this.x);
+    this.y = Math.round(this.y);
+    return this;
+  }
+
+  public round() {
+    return this.clone()._round();
+  }
+
+  public mag() {
+    return Math.sqrt(this.x * this.x + this.y * this.y);
+  }
+
+  public equals(other: Point) {
+    return this.x === other.x && this.y === other.y;
+  }
+
+  public dist(p: Point) {
+    return Math.sqrt(this.distSqr(p));
+  }
+
+  public distSqr(p: Point) {
+    const dx = p.x - this.x;
+    const dy = p.y - this.y;
+    return dx * dx + dy * dy;
+  }
+
+  public angle() {
+    return Math.atan2(this.y, this.x);
+  }
+
+  public angleTo(b: Point) {
+    return Math.atan2(this.y - b.y, this.x - b.x);
+  }
+
+  public angleWith(b: Point) {
+    return this.angleWithSep(b.x, b.y);
+  }
+
+  public angleWithSep(x: number, y: number) {
+    return Math.atan2(this.x * y - this.y * x, this.x * x + this.y * y);
+  }
+}

packages/map/src/geo/transform.ts

@@ -1,6 +1,6 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
 import { mat2, mat4, vec3, vec4 } from 'gl-matrix';
+import Point, { PointLike } from '../geo/point';
 import { clamp, interpolate, wrap } from '../util';
 import Aabb from '../utils/Aabb';
 import Frustum from '../utils/primitives';

packages/map/src/handler/IHandler.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../geo/point';
 import { Map } from '../map';
 export interface IHandlerResult {
   panDelta?: Point;

packages/map/src/handler/blockable_map_event.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../geo/point';
 import { Map } from '../map';
 import { MapMouseEvent, MapTouchEvent, MapWheelEvent } from './events';
 export default class BlockableMapEventHandler {

packages/map/src/handler/box_zoom.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../geo/point';
 import { Map } from '../map';
 import DOM from '../utils/dom';
 import { Event } from './events/event';

packages/map/src/handler/click_zoom.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../geo/point';
 import { Map } from '../map';
 
 export default class ClickZoomHandler {

packages/map/src/handler/events/map_mouse_event.ts

@@ -1,8 +1,8 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
 // tslint:disable-next-line:no-submodule-imports
 import merge from 'lodash/merge';
 import LngLat from '../../geo/lng_lat';
+import Point from '../../geo/point';
 import { Map } from '../../map';
 import DOM from '../../utils/dom';
 import { Event } from './event';

packages/map/src/handler/events/map_touch_event.ts

@@ -1,6 +1,6 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
 import LngLat from '../../geo/lng_lat';
+import Point from '../../geo/point';
 import { Map } from '../../map';
 import DOM from '../../utils/dom';
 import { Event } from './event';
@@ -61,7 +61,7 @@ export default class MapTouchEvent extends Event {
     const points = DOM.touchPos(map.getCanvasContainer(), touches);
     const lngLats = points.map((t: Point) => map.unproject(t));
     const point = points.reduce(
-      (prev: Point, curr: Point, i: number, arr: Point) => {
+      (prev: Point, curr: Point, i: number, arr: Point[]) => {
         return prev.add(curr.div(arr.length));
       },
       new Point(0, 0),

packages/map/src/handler/handler_inertia.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../geo/point';
 
 // tslint:disable-next-line:no-submodule-imports
 import merge from 'lodash/merge';

packages/map/src/handler/handler_manager.ts

@@ -1,7 +1,7 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
 // tslint:disable-next-line: no-submodule-imports
 import merge from 'lodash/merge';
+import Point from '../geo/point';
 import { Map } from '../map';
 import DOM from '../utils/dom';
 import BlockableMapEventHandler from './blockable_map_event';

packages/map/src/handler/handler_util.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../geo/point';
 
 export function indexTouches(touches: Touch[], points: Point[]) {
   const obj: { [key: string]: any } = {};

packages/map/src/handler/map_event.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../geo/point';
 import { Map } from '../map';
 import { MapMouseEvent, MapTouchEvent, MapWheelEvent } from './events';
 

packages/map/src/handler/mouse/mouse_handler.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import DOM from '../../utils/dom';
 import { buttonStillPressed } from './util';
 export default class MouseHandler {

packages/map/src/handler/mouse/mousepan_handler.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import DOM from '../../utils/dom';
 import MouseHandler from './mouse_handler';
 import { buttonStillPressed, LEFT_BUTTON } from './util';

packages/map/src/handler/mouse/mousepitch_hander.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import MouseHandler from './mouse_handler';
 import { LEFT_BUTTON, RIGHT_BUTTON } from './util';
 export default class MousePitchHandler extends MouseHandler {

packages/map/src/handler/mouse/mouserotate_hander.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import MouseHandler from './mouse_handler';
 import { LEFT_BUTTON, RIGHT_BUTTON } from './util';
 export default class MouseRotateHandler extends MouseHandler {

packages/map/src/handler/scroll_zoom.ts

@@ -1,6 +1,6 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
 import LngLat from '../geo/lng_lat';
+import Point from '../geo/point';
 import { Map } from '../map';
 import { bezier, ease, interpolate, now } from '../util';
 import DOM from '../utils/dom';
@@ -28,7 +28,7 @@ class ScrollZoomHandler {
   private active: boolean;
   private zooming: boolean;
   private aroundCenter: boolean;
-  private around: Point;
+  private around: LngLat;
   private aroundPoint: Point;
   private type: 'wheel' | 'trackpad' | null;
   private lastValue: number;
@@ -169,6 +169,7 @@ class ScrollZoomHandler {
       this.lastValue = value;
 
       // Start a timeout in case this was a singular event, and dely it by up to 40ms.
+      // @ts-ignore
       this.timeout = setTimeout(this.onTimeout, 40, e);
     } else if (!this.type) {
       // This is a repeating event, but we don't know the type of event just yet.
@@ -282,6 +283,7 @@ class ScrollZoomHandler {
 
     if (finished) {
       this.active = false;
+      // @ts-ignore
       this.finishTimeout = setTimeout(() => {
         this.zooming = false;
         this.handler.triggerRenderFrame();

packages/map/src/handler/tap/single_tap_recognizer.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import { indexTouches } from '../handler_util';
 
 function getCentroid(points: Point[]) {

packages/map/src/handler/tap/tap_drag_zoom.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import { MAX_TAP_INTERVAL } from './single_tap_recognizer';
 import TapRecognizer from './tap_recognizer';
 

packages/map/src/handler/tap/tap_recognizer.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import SingleTapRecognizer, {
   MAX_DIST,
   MAX_TAP_INTERVAL,

packages/map/src/handler/tap/tap_zoom.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import { Map } from '../../map';
 import TapRecognizer from './tap_recognizer';
 

packages/map/src/handler/touch/touch_pan.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import { indexTouches } from '../handler_util';
 
 export default class TouchPanHandler {

packages/map/src/handler/touch/touch_pitch.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import TwoTouchHandler from './two_touch';
 
 function isVertical(vector: { x: number; y: number }) {

packages/map/src/handler/touch/touch_rotate.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import DOM from '../../utils/dom';
 import TwoTouchHandler from './two_touch';
 

packages/map/src/handler/touch/touch_zoom.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import DOM from '../../utils/dom';
 import TwoTouchHandler from './two_touch';
 

packages/map/src/handler/touch/two_touch.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../../geo/point';
 import DOM from '../../utils/dom';
 
 export default class TwoTouchHandler {
@@ -21,7 +21,11 @@ export default class TwoTouchHandler {
   public start(points: [Point, Point]) {
     return;
   } // eslint-disable-line
-  public move(points: [Point, Point], pinchAround: Point, e: TouchEvent) {
+  public move(
+    points: [Point, Point],
+    pinchAround: Point | null,
+    e: TouchEvent,
+  ) {
     return;
   } // eslint-disable-line
 

packages/map/src/map.ts

@@ -1,11 +1,11 @@
 import { DOM } from '@antv/l7-utils';
-// @ts-ignore
-import Point, { PointLike } from '@mapbox/point-geometry';
 import { merge } from 'lodash';
 import Camera from './camera';
 import './css/l7.css';
 import LngLat, { LngLatLike } from './geo/lng_lat';
 import LngLatBounds, { LngLatBoundsLike } from './geo/lng_lat_bounds';
+// @ts-ignore
+import Point, { PointLike } from './geo/point';
 import BoxZoomHandler from './handler/box_zoom';
 import HandlerManager from './handler/handler_manager';
 import KeyboardHandler from './handler/keyboard';

packages/map/src/utils/dom.ts

@@ -1,5 +1,5 @@
 // @ts-ignore
-import Point from '@mapbox/point-geometry';
+import Point from '../geo/point';
 
 const DOM: {
   [key: string]: (...arg: any[]) => any;

packages/map/tsconfig.build.json

@@ -3,7 +3,10 @@
   "compilerOptions": {
     "declarationDir": "./es",
     "rootDir": "./src",
-    "baseUrl": "./"
+    "baseUrl": "./",
+    "paths": {
+      "*": ["node_modules", "typings/*"]
+    }
   },
   "include": ["./src"]
-}
+}

yarn.lock

@@ -5980,56 +5980,6 @@ ansicolors@~0.2.1:
   resolved "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz#be089599097b74a5c9c4a84a0cdbcdb62bd87aef"
   integrity sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8=
 
-antd@4.2.5, antd@^4.2.4:
-  version "4.2.5"
-  resolved "https://registry.npmjs.org/antd/-/antd-4.2.5.tgz#5f68fa9282e49306b8c8d44304321d9b979772d7"
-  integrity sha512-8rKCvik1gbru/nzodt+21r6ksWP9VPUfC74dhTLlRA1bY+7+ZZCS87+ikbAIARQRTh88LOe6nOxn5+3rJ3yOZA==
-  dependencies:
-    "@ant-design/css-animation" "^1.7.2"
-    "@ant-design/icons" "^4.1.0"
-    "@ant-design/react-slick" "~0.26.1"
-    array-tree-filter "^2.1.0"
-    classnames "~2.2.6"
-    copy-to-clipboard "^3.2.0"
-    lodash "^4.17.13"
-    moment "^2.25.3"
-    omit.js "^1.0.2"
-    prop-types "^15.7.2"
-    raf "^3.4.1"
-    rc-animate "~3.0.0"
-    rc-cascader "~1.1.0"
-    rc-checkbox "~2.2.0"
-    rc-collapse "~2.0.0"
-    rc-dialog "~7.7.0"
-    rc-drawer "~3.2.0"
-    rc-dropdown "~3.0.0"
-    rc-field-form "~1.2.0"
-    rc-input-number "~4.6.1"
-    rc-mentions "~1.1.0"
-    rc-menu "~8.2.1"
-    rc-notification "~4.3.0"
-    rc-pagination "~2.2.0"
-    rc-picker "~1.4.16"
-    rc-progress "~3.0.0"
-    rc-rate "~2.6.0"
-    rc-resize-observer "^0.2.0"
-    rc-select "~10.3.5"
-    rc-slider "~9.2.3"
-    rc-steps "~3.6.0"
-    rc-switch "~3.1.0"
-    rc-table "~7.5.3"
-    rc-tabs "~10.1.1"
-    rc-tooltip "~4.0.2"
-    rc-tree "~3.2.0"
-    rc-tree-select "~3.1.0"
-    rc-trigger "~4.1.0"
-    rc-upload "~3.0.4"
-    rc-util "^4.20.0"
-    rc-virtual-list "^1.1.0"
-    resize-observer-polyfill "^1.5.1"
-    scroll-into-view-if-needed "^2.2.20"
-    warning "~4.0.3"
-
 antd@^4.0.0:
   version "4.2.4"
   resolved "https://registry.npmjs.org/antd/-/antd-4.2.4.tgz#0a75e178643858960189912b8fe48bf7e8f6abf8"
@@ -6080,6 +6030,56 @@ antd@^4.0.0:
     scroll-into-view-if-needed "^2.2.20"
     warning "~4.0.3"
 
+antd@^4.2.4:
+  version "4.2.5"
+  resolved "https://registry.npmjs.org/antd/-/antd-4.2.5.tgz#5f68fa9282e49306b8c8d44304321d9b979772d7"
+  integrity sha512-8rKCvik1gbru/nzodt+21r6ksWP9VPUfC74dhTLlRA1bY+7+ZZCS87+ikbAIARQRTh88LOe6nOxn5+3rJ3yOZA==
+  dependencies:
+    "@ant-design/css-animation" "^1.7.2"
+    "@ant-design/icons" "^4.1.0"
+    "@ant-design/react-slick" "~0.26.1"
+    array-tree-filter "^2.1.0"
+    classnames "~2.2.6"
+    copy-to-clipboard "^3.2.0"
+    lodash "^4.17.13"
+    moment "^2.25.3"
+    omit.js "^1.0.2"
+    prop-types "^15.7.2"
+    raf "^3.4.1"
+    rc-animate "~3.0.0"
+    rc-cascader "~1.1.0"
+    rc-checkbox "~2.2.0"
+    rc-collapse "~2.0.0"
+    rc-dialog "~7.7.0"
+    rc-drawer "~3.2.0"
+    rc-dropdown "~3.0.0"
+    rc-field-form "~1.2.0"
+    rc-input-number "~4.6.1"
+    rc-mentions "~1.1.0"
+    rc-menu "~8.2.1"
+    rc-notification "~4.3.0"
+    rc-pagination "~2.2.0"
+    rc-picker "~1.4.16"
+    rc-progress "~3.0.0"
+    rc-rate "~2.6.0"
+    rc-resize-observer "^0.2.0"
+    rc-select "~10.3.5"
+    rc-slider "~9.2.3"
+    rc-steps "~3.6.0"
+    rc-switch "~3.1.0"
+    rc-table "~7.5.3"
+    rc-tabs "~10.1.1"
+    rc-tooltip "~4.0.2"
+    rc-tree "~3.2.0"
+    rc-tree-select "~3.1.0"
+    rc-trigger "~4.1.0"
+    rc-upload "~3.0.4"
+    rc-util "^4.20.0"
+    rc-virtual-list "^1.1.0"
+    resize-observer-polyfill "^1.5.1"
+    scroll-into-view-if-needed "^2.2.20"
+    warning "~4.0.3"
+
 any-observable@^0.3.0:
   version "0.3.0"
   resolved "https://registry.npmjs.org/any-observable/-/any-observable-0.3.0.tgz#af933475e5806a67d0d7df090dd5e8bef65d119b"