画布层

CanvasLayer 画布层是地图默认包含的一个工具图层。该图层用于在地图上绘制和展示几何图形。与 VectorLayer 类似，二者都展示矢量图形。不同点在于，VectorLayer 可以处理几何对象，而 CanvasLayer 仅处理几何图形。

如需获取地图的画布层，调用 map.getCanvas() 方法。下面示例在画布层添加了地理位置点：

@Autowired
private GeoMap map;

@Autowired
private GroupTable<Order> ordersTable;

@Subscribe("showOrder")
public void onShowOrderClick(Button.ClickEvent event) {
    CanvasLayer canvasLayer = map.getCanvas();
    Point point = ordersTable.getSingleSelected().getLocation();
    canvasLayer.addPoint(point);
}

添加几何图形的方法返回一个在画布上表示此几何图形的对象：CanvasLayer.Point、CanvasLayer.Polyline 或 CanvasLayer.Polygon。使用此对象可以定义样式或弹窗、订阅与此图形相关的事件，或者使用此对象从画布删除几何图形。

下面是设置点样式的示例：

@Autowired
private GeoMap map;

@Autowired
private GroupTable<Order> ordersTable;

@Autowired
private GeometryStyles geometryStyles;

protected void drawGeometry() {
    Order order = ordersTable.getSingleSelected();
    CanvasLayer canvasLayer = map.getCanvas();

    CanvasLayer.Point location = canvasLayer.addPoint(order.getLocation());
    location.setStyle(
            geometryStyles.point()
                    .withFontIcon(JmixIcon.HOME)
                    .setIconPathFillColor("#f4d142")
                    .setIconTextFillColor("black")
                    .setIconPathStrokeColor("black"))
            .setEditable(true);
}

也可以通过 UI 在画布上绘制几何图形。例如，调用 canvas.drawPoint() 绘制一个点。调用该方法后，地图会转入绘制模式。方法接收一个 Consumer<CanvasLayer.Point> 函数，这个函数中可以对绘制的点做进一步操作。

@Autowired
private GeoMap map;

@Autowired
private GroupTable<Order> ordersTable;

@Subscribe("drawPoint")
private void onDrawPointClick(Button.ClickEvent event) {
    CanvasLayer canvasLayer = map.getCanvas();
    canvasLayer.drawPoint(point -> {
        ordersTable.getSingleSelected().setLocation(point.getGeometry());
    });
}
使用 UI 在画布绘制几何图形之前，需要调用 map.selectLayerById(CanvasLayer.ID) 在地图中选中画布。

也可以在 XML 中指定选中的图层：

<maps:geoMap id="map" width="50%" centerX="40" centerY="40" zoom="4">
    <maps:layers selectedLayer="CANVAS">
        <maps:tile id="tiles" tileProvider="sample_CartoTileProvider"/>
    </maps:layers>
</maps:geoMap>