@hpcc-js/map 3.5.2 → 3.5.4

package/src/GMapCounties.ts

@@ -1,93 +1,93 @@
-import { Widget } from "@hpcc-js/common";
-import { ChoroplethCounties } from "./ChoroplethCounties.ts";
-import { GMapLayered } from "./GMapLayered.ts";
-
-export class GMapCounties extends GMapLayered {
-    _counties: ChoroplethCounties;
-    _view;
-    _palette;
-    _dataMinWeight;
-    _dataMaxWeight;
-
-    constructor() {
-        super();
-
-        const context = this;
-        this._counties = new ChoroplethCounties()
-            .paletteID("Blues")
-            .meshVisible(false)
-            .opacity(0.80)
-            .columns(["fips", "weight"])
-            .on("click", function (row, col, sel) {
-                context.click(row, col, sel);
-            })
-            .on("dblclick", function (row, col, sel) {
-                context.dblclick(row, col, sel);
-            })
-            ;
-    }
-
-    enter(domNode, element) {
-        super.enter(domNode, element);
-        this
-            .layers([
-                this._counties
-            ])
-            ;
-    }
-
-    update(domNode, element) {
-        this._counties.data(this.data());
-        super.update(domNode, element);
-        this._palette = this._counties._palette;
-        this._dataMinWeight = this._counties._dataMinWeight;
-        this._dataMaxWeight = this._counties._dataMaxWeight;
-    }
-
-    private _prevBounds;
-    render(callback: (w: Widget) => this): this {
-        return super.render(w => {
-            if (this._renderCount > 1 && this.autoScale()) {
-                const bounds = this._counties.getDataBounds();
-                if (bounds.x && bounds.y &&
-                    (!this._prevBounds ||
-                        this._prevBounds.x !== bounds.x ||
-                        this._prevBounds.y !== bounds.y ||
-                        this._prevBounds.width !== bounds.width ||
-                        this._prevBounds.height !== bounds.height)
-                ) {
-                    this._prevBounds = bounds;
-                    const tl = this.invert(bounds.x, bounds.y);
-                    const br = this.invert(bounds.x + bounds.width, bounds.y + bounds.height);
-                    if (tl && br) {
-                        this.zoomTo([
-                            [tl[1], tl[0]],
-                            [br[1], br[0]]
-                        ]);
-                    }
-                }
-            }
-            if (callback) {
-                callback(w);
-            }
-        });
-    }
-
-    exit(domNode, element) {
-        super.exit(domNode, element);
-    }
-
-    click(row, column, selected) {
-    }
-
-    dblclick(row, column, selected) {
-    }
-}
-GMapCounties.prototype._class += " map_GMapCounties";
-
-export interface GMapCounties {
-    autoScale(): boolean;
-    autoScale(_: boolean): this;
-}
-
-GMapCounties.prototype.publish("autoScale", false, "boolean", "Auto scale to data");
+import { Widget } from "@hpcc-js/common";
+import { ChoroplethCounties } from "./ChoroplethCounties.ts";
+import { GMapLayered } from "./GMapLayered.ts";
+
+export class GMapCounties extends GMapLayered {
+    _counties: ChoroplethCounties;
+    _view;
+    _palette;
+    _dataMinWeight;
+    _dataMaxWeight;
+
+    constructor() {
+        super();
+
+        const context = this;
+        this._counties = new ChoroplethCounties()
+            .paletteID("Blues")
+            .meshVisible(false)
+            .opacity(0.80)
+            .columns(["fips", "weight"])
+            .on("click", function (row, col, sel) {
+                context.click(row, col, sel);
+            })
+            .on("dblclick", function (row, col, sel) {
+                context.dblclick(row, col, sel);
+            })
+            ;
+    }
+
+    enter(domNode, element) {
+        super.enter(domNode, element);
+        this
+            .layers([
+                this._counties
+            ])
+            ;
+    }
+
+    update(domNode, element) {
+        this._counties.data(this.data());
+        super.update(domNode, element);
+        this._palette = this._counties._palette;
+        this._dataMinWeight = this._counties._dataMinWeight;
+        this._dataMaxWeight = this._counties._dataMaxWeight;
+    }
+
+    private _prevBounds;
+    render(callback: (w: Widget) => this): this {
+        return super.render(w => {
+            if (this._renderCount > 1 && this.autoScale()) {
+                const bounds = this._counties.getDataBounds();
+                if (bounds.x && bounds.y &&
+                    (!this._prevBounds ||
+                        this._prevBounds.x !== bounds.x ||
+                        this._prevBounds.y !== bounds.y ||
+                        this._prevBounds.width !== bounds.width ||
+                        this._prevBounds.height !== bounds.height)
+                ) {
+                    this._prevBounds = bounds;
+                    const tl = this.invert(bounds.x, bounds.y);
+                    const br = this.invert(bounds.x + bounds.width, bounds.y + bounds.height);
+                    if (tl && br) {
+                        this.zoomTo([
+                            [tl[1], tl[0]],
+                            [br[1], br[0]]
+                        ]);
+                    }
+                }
+            }
+            if (callback) {
+                callback(w);
+            }
+        });
+    }
+
+    exit(domNode, element) {
+        super.exit(domNode, element);
+    }
+
+    click(row, column, selected) {
+    }
+
+    dblclick(row, column, selected) {
+    }
+}
+GMapCounties.prototype._class += " map_GMapCounties";
+
+export interface GMapCounties {
+    autoScale(): boolean;
+    autoScale(_: boolean): this;
+}
+
+GMapCounties.prototype.publish("autoScale", false, "boolean", "Auto scale to data");

package/src/GMapGraph.ts

@@ -1,61 +1,61 @@
-import { Shape } from "@hpcc-js/common";
-import { Edge, Graph } from "@hpcc-js/graph";
-import { GMap } from "./GMap.ts";
-
-export class GMapGraph extends GMap {
-    constructor() {
-        super();
-    }
-
-    enter() {
-        super.enter.apply(this, arguments);
-        const graph = new Graph()
-            .layout("None")
-            .zoomable(false)
-            ;
-
-        const origRender = graph.render;
-        const context = this;
-        graph.render = function (callback?): Graph {
-            const vertices = [];
-            const edges = [];
-            let prevAddr = null;
-            context.data().forEach(function (row) {
-                const pos2 = context._viewportSurface.project(row[0], row[1]);
-                const newAddr = new Shape()
-                    .shape("circle")
-                    .radius(3)
-                    .data(row)
-                    .pos(pos2)
-                    ;
-                vertices.push(newAddr);
-                if (prevAddr) {
-                    edges.push(new Edge()
-                        .sourceVertex(prevAddr)
-                        .targetVertex(newAddr)
-                        .sourceMarker("none")
-                        .targetMarker("arrow")
-                    );
-                }
-                prevAddr = newAddr;
-            });
-            this.data({ vertices, edges });
-            const retVal = origRender.apply(this, arguments);
-            /*
-            this.graphData.nodeValues().forEach(function (vertex) {
-                const pos = context._viewportSurface.project(vertex.data()[0], vertex.data()[1]);
-                // pos.x -= context.width() / 2;
-                // pos.y -= context.height() / 2;
-                vertex.move(pos);
-            });
-            this.graphData.edgeValues().forEach(function (edge) {
-                edge.points([]);
-            });
-            */
-            return retVal;
-        };
-
-        this._viewportSurface.widget(graph);
-    }
-}
-GMapGraph.prototype._class += " map_GMapGraph";
+import { Shape } from "@hpcc-js/common";
+import { Edge, Graph } from "@hpcc-js/graph";
+import { GMap } from "./GMap.ts";
+
+export class GMapGraph extends GMap {
+    constructor() {
+        super();
+    }
+
+    enter() {
+        super.enter.apply(this, arguments);
+        const graph = new Graph()
+            .layout("None")
+            .zoomable(false)
+            ;
+
+        const origRender = graph.render;
+        const context = this;
+        graph.render = function (callback?): Graph {
+            const vertices = [];
+            const edges = [];
+            let prevAddr = null;
+            context.data().forEach(function (row) {
+                const pos2 = context._viewportSurface.project(row[0], row[1]);
+                const newAddr = new Shape()
+                    .shape("circle")
+                    .radius(3)
+                    .data(row)
+                    .pos(pos2)
+                    ;
+                vertices.push(newAddr);
+                if (prevAddr) {
+                    edges.push(new Edge()
+                        .sourceVertex(prevAddr)
+                        .targetVertex(newAddr)
+                        .sourceMarker("none")
+                        .targetMarker("arrow")
+                    );
+                }
+                prevAddr = newAddr;
+            });
+            this.data({ vertices, edges });
+            const retVal = origRender.apply(this, arguments);
+            /*
+            this.graphData.nodeValues().forEach(function (vertex) {
+                const pos = context._viewportSurface.project(vertex.data()[0], vertex.data()[1]);
+                // pos.x -= context.width() / 2;
+                // pos.y -= context.height() / 2;
+                vertex.move(pos);
+            });
+            this.graphData.edgeValues().forEach(function (edge) {
+                edge.points([]);
+            });
+            */
+            return retVal;
+        };
+
+        this._viewportSurface.widget(graph);
+    }
+}
+GMapGraph.prototype._class += " map_GMapGraph";

package/src/GMapHeat.ts

@@ -1,27 +1,27 @@
-import { HeatMap } from "@hpcc-js/other";
-import { GMap } from "./GMap.ts";
-
-export class GMapHeat extends GMap {
-    constructor() {
-        super();
-    }
-
-    enter() {
-        super.enter.apply(this, arguments);
-        const heat = new HeatMap();
-
-        const origRender = heat.render;
-        const context = this;
-        heat.render = function (callback?): HeatMap {
-            this.data(context.data().map(function (row) {
-                const pos = context._viewportSurface.project(row[0], row[1]);
-                return [pos.x, pos.y, row[4]];
-            }));
-            origRender.apply(this, arguments);
-            return this;
-        };
-
-        this._viewportSurface.widget(heat);
-    }
-}
-GMapHeat.prototype._class += " map_GMapHeat";
+import { HeatMap } from "@hpcc-js/other";
+import { GMap } from "./GMap.ts";
+
+export class GMapHeat extends GMap {
+    constructor() {
+        super();
+    }
+
+    enter() {
+        super.enter.apply(this, arguments);
+        const heat = new HeatMap();
+
+        const origRender = heat.render;
+        const context = this;
+        heat.render = function (callback?): HeatMap {
+            this.data(context.data().map(function (row) {
+                const pos = context._viewportSurface.project(row[0], row[1]);
+                return [pos.x, pos.y, row[4]];
+            }));
+            origRender.apply(this, arguments);
+            return this;
+        };
+
+        this._viewportSurface.widget(heat);
+    }
+}
+GMapHeat.prototype._class += " map_GMapHeat";

package/src/GMapLayered.ts

@@ -1,94 +1,94 @@
-import { Widget } from "@hpcc-js/common";
-import { AbsoluteSurface } from "@hpcc-js/layout";
-import { GMap, google } from "./GMap.ts";
-import { Layered } from "./Layered.ts";
-
-const zoomFactor = 1 / (1 << 4);
-
-class OverlayLayered extends Layered {
-    gmap: GMap;
-    surface: AbsoluteSurface;
-
-    constructor(gmap: GMap, surface: AbsoluteSurface) {
-        super();
-        this.gmap = gmap;
-        this.surface = surface;
-        this.autoScaleMode("none");
-        this
-            .zoomable(false)
-            .zoomDuration(10)
-            ;
-
-    }
-
-    getProjection() {
-        return this.gmap._overlay.getProjection();
-    }
-
-    render(callback?: any): this {
-        super.render((w) => {
-            const projection = this.getProjection();
-            if (projection) {
-                // TODO - global usage should not be used - see GMap.ts
-                const center = new (window as any).google.maps.LatLng(0, 0);
-                const pos = projection.fromLatLngToDivPixel(center);
-                const widgetX = this.surface.widgetX();
-                const widgetY = this.surface.widgetY();
-                const translate = [(pos.x - widgetX), (pos.y - widgetY)];
-                const zoom = this.gmap._googleMap.getZoom();
-                this.zoomTo(translate, zoomFactor * (1 << zoom), 0);
-            }
-            if (callback) {
-                callback(w);
-            }
-        });
-        return this;
-    }
-}
-
-export class GMapLayered extends GMap {
-    private layered: OverlayLayered;
-
-    constructor() {
-        super();
-        this.layered = new OverlayLayered(this, this._viewportSurface);
-        this._viewportSurface.widget(this.layered);
-    }
-
-    invert(x: number, y: number): { lat: number, lng: number } | undefined {
-        return this.layered.invert(x, y);
-    }
-
-    rproject(x: number, y: number): { lat: number, lng: number } | undefined {
-        const projection = this.layered.getProjection();
-        const latLng = projection.fromDivPixelToLatLng(new google.maps.Point(x, y));
-        return {
-            lat: latLng.lat(),
-            lng: latLng.lng()
-        };
-    }
-
-    updateCircles() { }
-    updatePins() { }
-
-    layers(): Widget[];
-    layers(_: Widget[]): this;
-    layers(_?: Widget[]): Widget[] | this {
-        if (!arguments.length) return this.layered.layers();
-        this.layered.layers(_);
-        return this;
-    }
-
-    render(callback?) {
-        return super.render(w => {
-            this.layered.preRender().then(() => {
-                this.layered.render(w => {
-                    if (callback) {
-                        callback(w);
-                    }
-                });
-            });
-        });
-    }
-}
-GMapLayered.prototype._class += " map_GMapLayered";
+import { Widget } from "@hpcc-js/common";
+import { AbsoluteSurface } from "@hpcc-js/layout";
+import { GMap, google } from "./GMap.ts";
+import { Layered } from "./Layered.ts";
+
+const zoomFactor = 1 / (1 << 4);
+
+class OverlayLayered extends Layered {
+    gmap: GMap;
+    surface: AbsoluteSurface;
+
+    constructor(gmap: GMap, surface: AbsoluteSurface) {
+        super();
+        this.gmap = gmap;
+        this.surface = surface;
+        this.autoScaleMode("none");
+        this
+            .zoomable(false)
+            .zoomDuration(10)
+            ;
+
+    }
+
+    getProjection() {
+        return this.gmap._overlay.getProjection();
+    }
+
+    render(callback?: any): this {
+        super.render((w) => {
+            const projection = this.getProjection();
+            if (projection) {
+                // TODO - global usage should not be used - see GMap.ts
+                const center = new (window as any).google.maps.LatLng(0, 0);
+                const pos = projection.fromLatLngToDivPixel(center);
+                const widgetX = this.surface.widgetX();
+                const widgetY = this.surface.widgetY();
+                const translate = [(pos.x - widgetX), (pos.y - widgetY)];
+                const zoom = this.gmap._googleMap.getZoom();
+                this.zoomTo(translate, zoomFactor * (1 << zoom), 0);
+            }
+            if (callback) {
+                callback(w);
+            }
+        });
+        return this;
+    }
+}
+
+export class GMapLayered extends GMap {
+    private layered: OverlayLayered;
+
+    constructor() {
+        super();
+        this.layered = new OverlayLayered(this, this._viewportSurface);
+        this._viewportSurface.widget(this.layered);
+    }
+
+    invert(x: number, y: number): { lat: number, lng: number } | undefined {
+        return this.layered.invert(x, y);
+    }
+
+    rproject(x: number, y: number): { lat: number, lng: number } | undefined {
+        const projection = this.layered.getProjection();
+        const latLng = projection.fromDivPixelToLatLng(new google.maps.Point(x, y));
+        return {
+            lat: latLng.lat(),
+            lng: latLng.lng()
+        };
+    }
+
+    updateCircles() { }
+    updatePins() { }
+
+    layers(): Widget[];
+    layers(_: Widget[]): this;
+    layers(_?: Widget[]): Widget[] | this {
+        if (!arguments.length) return this.layered.layers();
+        this.layered.layers(_);
+        return this;
+    }
+
+    render(callback?) {
+        return super.render(w => {
+            this.layered.preRender().then(() => {
+                this.layered.render(w => {
+                    if (callback) {
+                        callback(w);
+                    }
+                });
+            });
+        });
+    }
+}
+GMapLayered.prototype._class += " map_GMapLayered";