shengzheng1981/green-gis-js

Green GIS JS API is a lite GIS JS API based on Canvas API

green-gis-js's Issues

measurer和editor如果使用偏移后的投影，都会出现一些点击位置和绘制位置不一致的问题

measurer已经修复,editor比较复杂，目前没有思路。
map.ts
_onClick(event) { const matrix = (this._ctx as any).getTransform(); const x = (event.offsetX - matrix.e) / matrix.a; const y = (event.offsetY - matrix.f) / matrix.d; [event.lng, event.lat] = this._projection.unproject([x, y]); [event.originalLng, event.originalLat] = this._projection.unproject([x, y], true); if (this._editor && this._editor.editing) { this._editor._onClick(event); return; } if (this._measurer && this._measurer.measuring) { this._measurer._onClick(event); return; } //this._handlers["click"].forEach(handler => handler(event)); this.emit("click", event); }
_onMouseMove(event) { if (this._editor.editing) { const matrix = (this._ctx as any).getTransform(); const x = (event.offsetX - matrix.e) / matrix.a; const y = (event.offsetY - matrix.f) / matrix.d; [event.lng, event.lat] = this._projection.unproject([x, y]); [event.originalLng, event.originalLat] = this._projection.unproject([x, y], true); this._editor._onMouseMove(event); return; } if (this._measurer.measuring) { const matrix = (this._ctx as any).getTransform(); const x = (event.offsetX - matrix.e) / matrix.a; const y = (event.offsetY - matrix.f) / matrix.d; [event.lng, event.lat] = this._projection.unproject([x, y]); [event.originalLng, event.originalLat] = this._projection.unproject([x, y], true); this._measurer._onMouseMove(event); return; } if (!this._drag.flag) { this._handlers["mousemove"].forEach(handler => handler(event)); } }
measurer.ts
_onClick(event) { if (!this._measuring) return; if (event.detail > 1) return; if (this._action === MeasureActionType.Polygon) { if (this._create.click == 0) { this._createLayer.clear(); const point = new Point(event.originalLng, event.originalLat); const graphic = new Graphic(point, this._defaultPointSymbol); this._createLayer.add(graphic); this._create.click += 1; this._create.lnglats.push([event.originalLng, event.originalLat]); } else if (this._create.click == 1) { const second = new Point(event.originalLng, event.originalLat); const graphic1 = new Graphic(second, this._defaultPointSymbol); this._createLayer.add(graphic1); if (this._create.graphic) this._createLayer.remove(this._create.graphic); this._create.lnglats.push([event.originalLng, event.originalLat]); const line = new Polyline(this._create.lnglats); this._create.graphic = new Graphic(line, this._defaultLineSymbol); this._createLayer.add(this._create.graphic); this._create.click += 1; } else { const second = new Point(event.originalLng, event.originalLat); const graphic1 = new Graphic(second, this._defaultPointSymbol); this._createLayer.add(graphic1); if (this._create.graphic) this._createLayer.remove(this._create.graphic); this._create.lnglats.push([event.originalLng, event.originalLat]); const polygon = new Polygon([this._create.lnglats]); this._create.graphic = new Graphic(polygon, this._defaultPolygonSymbol); this._createLayer.add(this._create.graphic); this._create.click += 1; } } else if (this._action === MeasureActionType.Polyline) { if (this._create.click == 0) { this._createLayer.clear(); const point = new Point(event.originalLng, event.originalLat); const graphic = new Graphic(point, this._defaultPointSymbol); this._createLayer.add(graphic); this._create.click += 1; this._create.lnglats.push([event.originalLng, event.originalLat]); } else { const second = new Point(event.originalLng, event.originalLat); const graphic1 = new Graphic(second, this._defaultPointSymbol); this._createLayer.add(graphic1); if (this._create.graphic) this._createLayer.remove(this._create.graphic); this._create.lnglats.push([event.originalLng, event.originalLat]); const line = new Polyline(this._create.lnglats); this._create.graphic = new Graphic(line, this._defaultLineSymbol); this._createLayer.add(this._create.graphic); this._create.click += 1; } } }
_onMouseMove(event) { if (!this._measuring) return; if (this._action === MeasureActionType.Polygon) { if (this._create.click == 1) { if (this._create.graphic) this._createLayer.remove(this._create.graphic); const lnglats: any = [...this._create.lnglats]; lnglats.push([event.originalLng, event.originalLat]); const line = new Polyline(lnglats); this._create.graphic = new Graphic(line, this._defaultLineSymbol); this._createLayer.add(this._create.graphic); } else if (this._create.click > 1){ if (this._create.graphic) this._createLayer.remove(this._create.graphic); const lnglats: any = [...this._create.lnglats]; lnglats.push([event.originalLng, event.originalLat]); const polygon = new Polygon([lnglats]); this._create.graphic = new Graphic(polygon, this._defaultPolygonSymbol); this._createLayer.add(this._create.graphic); } } else if (this._action === MeasureActionType.Polyline) { if (this._create.click > 0) { if (this._create.graphic) this._createLayer.remove(this._create.graphic); const lnglats: any = [...this._create.lnglats]; lnglats.push([event.originalLng, event.originalLat]); const line = new Polyline(lnglats); this._create.graphic = new Graphic(line, this._defaultLineSymbol); this._createLayer.add(this._create.graphic); } } this.redraw(); }

multiple-polygon、multiple-polyline的getCenter方法可能存在问题

multiple-polygon.ts 中多面的数据结构发生变化，导致获取的中心点[NAN,NAN]

How to reproject a raster image?

The lesson is very nice and i leanred much. But now i have a problem, how to reproject a raster image from wgs84 to web mercator in js? I konw how to transform a point coordinate, but I have no idea of how to operate image. Could you give me some ideas please? Best wishes to you!

如果设置了例如GCJO2 BD09的投影变换，fitBound会导致中心点偏移

fitBound方法通过unproject得到的中心点坐标是偏移后的坐标，setView方法传入偏移后的坐标会再偏移一次。

关于代码整理的疑问

1、是否考虑将GraphicLayer和SelectionLayer相关的方法放到viewer中
2、GraphicLayer和SelectionLayer remove或者clear后调用draw方法不会生效，需要重绘视图