将EasyButton，Geoman与ngx-leaflet集成

本文介绍了将EasyButton，Geoman与ngx-leaflet集成的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我在Angular应用程序中使用raw leaflet.js，它依赖于某些传单插件，例如EasyButton，Geoman，Distortable Image.ngx-leaflet看起来很酷而且很简单.所以我决定迁移到 ngx-leaflet.但是我确定是否可以将这些插件与库集成在一起.如果是这样，请提供一些指导.

I am using raw leaflet.js in my Angular Application which depends on some leaflet plugins like EasyButton, Geoman, Distortable Image. ngx-leaflet looks cool and simple. So I've decided to migrate to ngx-leaflet. But I am sure if it is possible to integrate these plugins with the library. If so provide some guidance.

推荐答案

回答我自己的问题.这是我让Geoman使用ngx-leaflet所遵循的步骤.

Answering my own question.Here are the steps I followed to get geoman working with ngx-leaflet.

安装 geoman npm i @geoman-io/leaflet-geoman-free.请参考 geoman github页面
以styles.scss导入geoman css. @import'../node_modules/@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.css';
将geoman导入组件 import'@ geoman-io/leaflet-geoman-free'; 完成.
Import geoman in the component import '@geoman-io/leaflet-geoman-free';Done.
然后像这样使用它
```
this.map.pm.addControls({
      position: 'topleft',
      drawCircle: false,
      drawCircleMarker: false,
      drawPolyline: true,
      drawRectangle: false,
      drawPolygon: true,
      editMode: false,
      dragMode: false,
      cutPolygon: false,
      removalMode: false,
      drawMarker: false
    });
```
这篇关于将EasyButton，Geoman与ngx-leaflet集成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！