@2gis/markerdrawer - npm Package Compare versions

Comparing version 0.0.6 to 0.0.7

demo/index.ts

@@ -72,6 +72,6 @@ import * as DG from '2gis-maps';
 
-const markerDrawer = new MarkerDrawer(atlas, {
+const markerDrawer = new MarkerDrawer({
     bufferFactor: 0.5,
 });
-
+markerDrawer.setAtlas(atlas);
 markerDrawer.setMarkers(markersData);
@@ -124,5 +124,6 @@
 
-const markerDrawer2 = new MarkerDrawer(atlas2, {
+const markerDrawer2 = new MarkerDrawer({
     bufferFactor: 0.5,
 });
+markerDrawer2.setAtlas(atlas2);
 
@@ -129,0 +130,0 @@ const markersData2: Marker[] = [];

package.json

 {
   "name": "@2gis/markerdrawer",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "description": "Library for fast drawing a huge amount of markers",
@@ -5,0 +5,0 @@ "author": {

src/CanvasRenderer.ts

@@ -45,2 +45,3 @@ import { Atlas } from './Atlas';
     private _bufferFactor: number;
+    private _updateOnMoveEnd: boolean;
     private _bufferOffset: Vec2;
@@ -62,4 +63,3 @@
 
-    constructor(atlas: Atlas, debugDrawing: boolean, bufferFactor: number, zIndex?: number) {
-        this._atlas = atlas;
+    constructor(debugDrawing: boolean, bufferFactor: number, zIndex?: number, updateOnMoveEnd: boolean = true) {
         this._markers = [];
@@ -70,3 +70,4 @@ this._markersData = [];
         this._bufferFactor = bufferFactor;
-        this._markersPerFrame = 5000;
+        this._updateOnMoveEnd = updateOnMoveEnd;
+        this._markersPerFrame = 1000;
         this._timePerFrame = 10;
@@ -87,9 +88,16 @@ this._origin = vec2create();
 
+    public setAtlas(atlas: Atlas) {
+        if (atlas) {
+            this._atlas = atlas;
+            this._atlas.whenReady()
+                .then(() => {
+                    this.update();
+                });
+        }
+    }
+
     public setMarkers(markers: Marker[]) {
         this._needUpdate = false;
 
-        if (this._isRendering) {
-            cancelAnimationFrame(this._requestAnimationFrameId);
-            this._isRendering = false;
-        }
+        this._stopRendering();
 
@@ -116,2 +124,3 @@ // Set ordered indices
             viewreset: this.update,
+            movestart: this._onMoveStart,
             moveend: this._onMoveEnd,
@@ -131,2 +140,3 @@ zoomstart: this._onZoomStart,
             viewreset: this.update,
+            movestart: this._onMoveStart,
             moveend: this._onMoveEnd,
@@ -201,2 +211,9 @@ zoomstart: this._onZoomStart,
 
+    private _stopRendering() {
+        if (this._isRendering) {
+            cancelAnimationFrame(this._requestAnimationFrameId);
+            this._isRendering = false;
+        }
+    }
+
     private _onResize = () => {
@@ -243,5 +260,11 @@ if (!this._map) {
         this._isZooming = false;
-        this.update();
+        if (this._updateOnMoveEnd) {
+            this.update();
+        }
     }
 
+    private _onMoveStart = () => {
+        this._stopRendering();
+    }
+
     private _render() {
@@ -248,0 +271,0 @@ if (!this._map) {

src/MarkerDrawer.ts

@@ -9,2 +9,3 @@ import { Atlas } from './Atlas';
     zIndex?: number;
+    updateOnMoveEnd?: boolean;
 }
@@ -17,3 +18,2 @@
     private _markers: Marker[];
-    private _atlas: Atlas;
     private _map?: L.Map;
@@ -25,15 +25,18 @@ private _renderer: CanvasRenderer;
 
-    constructor(atlas: Atlas, options: MarkerDrawerOptions = {}) {
+    constructor(options: MarkerDrawerOptions = {}) {
         super();
 
-        this._atlas = atlas;
         this._markers = [];
         this._renderer = new CanvasRenderer(
-            this._atlas,
             options.debugDrawing || false,
             options.bufferFactor !== undefined ? options.bufferFactor : 0.5,
             options.zIndex,
+            options.updateOnMoveEnd,
         );
     }
 
+    public setAtlas(atlas: Atlas) {
+        this._renderer.setAtlas(atlas);
+    }
+
     public setMarkers(markers: Marker[]) {
@@ -68,6 +71,2 @@ this._markers = markers;
         this._pane.appendChild(this._renderer.container);
-        this._atlas.whenReady()
-            .then(() => {
-                this._renderer.update();
-            });
 
@@ -74,0 +73,0 @@ return this;

src/types.ts

@@ -1,3 +0,5 @@
-export type Vec2 = [number, number] | Float64Array;
+import { Atlas } from './Atlas';
 
+export type Vec2 = [number, number] | Float64Array | number[];
+
 export type LngLat = [number, number];
@@ -18,2 +20,3 @@
     setMarkers(markes: Marker[]);
+    setAtlas(atlas: Atlas);
     setDebugDrawing(value: boolean);
@@ -20,0 +23,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

134831

increased by0.48%

Lines of code

943

increased by2.39%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes