This is an automated email from the ASF dual-hosted git repository.

jiayu pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/sedona.git


The following commit(s) were added to refs/heads/master by this push:
     new 0bcfa656 [SEDONA-264] zeppelin helium plugin supports drawing geometry 
like linestring, polygon (#801)
0bcfa656 is described below

commit 0bcfa656205153933385b66b4b27c61bbaff7fad
Author: the-sea <[email protected]>
AuthorDate: Sat Mar 18 15:32:57 2023 +0800

    [SEDONA-264] zeppelin helium plugin supports drawing geometry like 
linestring, polygon (#801)
---
 zeppelin/index.js | 29 +++++++++++++++++++++++------
 1 file changed, 23 insertions(+), 6 deletions(-)

diff --git a/zeppelin/index.js b/zeppelin/index.js
index 0de3c87a..9776ba47 100644
--- a/zeppelin/index.js
+++ b/zeppelin/index.js
@@ -57,7 +57,7 @@ export default class LeafletMap extends Visualization {
                ];
 
                this.transformation = new ColumnselectorTransformation(config, 
columnSpec);
-               this.chartInstance = L.map(this.getChartElementId());
+               this.chartInstance = this.createMap();
        }
 
        getTransformation() {
@@ -68,11 +68,16 @@ export default class LeafletMap extends Visualization {
                super.setConfig(config);
                this.transformation.setConfig(config);
                if (!this.chartInstance) {
-                       this.chartInstance = L.map(this.getChartElementId());
+                       this.chartInstance = this.createMap();
                }
                return this.chartInstance;
        };
 
+       createMap() {
+           // using canvas renderer to support drawing geometry like 
LineString, Polygon etc.
+           return L.map(this.getChartElementId(), {renderer: L.canvas()});
+       }
+
        getChartElementId() {
                return this.targetEl[0].id
        };
@@ -109,21 +114,33 @@ export default class LeafletMap extends Visualization {
                map.invalidateSize(true)
 
                var imageBounds = null
-               const markers = chartDataModel.rows.map(
+               const markers = chartDataModel.rows.flatMap(
                                row => {
                                        const {image, boundary, info} = row;
+                                       var markers = [];
+
                                        // throw new Error(image);
                                        var jsts = require("jsts");
                                        // Read WKT string from Sedona
                                        var reader = new jsts.io.WKTReader();
-                                       var obj = reader.read(boundary)
+                                       var obj = reader.read(boundary);
                                        // Collect the centroid point of the 
input geometry
                                        var centroid = obj.getCentroid()
                                        var marker = L.marker([centroid.getY(), 
centroid.getX()]);
                                        const mapMarker = marker.addTo(map);
+                                       markers.push(marker);
+
+                                       if (obj.getGeometryType() !== 'Point') {
+                                           var writer = new 
jsts.io.GeoJSONWriter();
+                                           var geojson = writer.write(obj);
+                                           marker = L.geoJSON(geojson);
+                                           marker.addTo(map);
+                                           markers.push(marker);
+                                       }
+
                                        // Attach the marker information if 
exists
                                        if(info){
-                                               mapMarker.bindTooltip(info)
+                                               mapMarker.bindTooltip(info);
                                        }
                                        // Overlay the generated image over the 
tile layer
                                        if (image) {
@@ -133,7 +150,7 @@ export default class LeafletMap extends Visualization {
                                                var imageUrl = 
'data:image/png;base64,' + image;
                                                L.imageOverlay(imageUrl, 
imageBounds).addTo(map);
                                        }
-                                       return marker
+                                       return markers;
                        }
                );
                // Adjust the location of the viewport

Reply via email to