小编rob*_*ert的帖子

如何在单独的控制框中创建位于传单地图上的自定义按钮，以创建“折线”、“多边形”或“标记”，这些按钮都将位于单独的按钮上，而不使用传单绘制的 标准 UI 工具栏。我真的很想知道如何以“React”方式与 Vanilla Javascript编写它，因为我的整个程序都是用 React 编写的。如果有人可以将一个简单的程序放在一起，展示如何使用单独的按钮在 React 中绘制“折线、多边形”等，那将不胜感激。

这是我的一些代码的片段。谢谢

<Map
  zoomControl={false}
  center={position}
  zoom={this.state.zoom}
  className={classes.height}
  ref={m => {
    this.leafletMap = m;
  }}>
  {/* LAYER CONTROL ON TOP OF MAP*/}
  <LayersControl position="topright">
    <BaseLayer checked name="OpenStreetMap.Mapnik">
      <TileLayer
        attribution='&amp;copy <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
                     url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
      />
    </BaseLayer>
    <BaseLayer name="OpenStreetMap.BlackAndWhite">
      <TileLayer
        attribution='&amp;copy <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
                     url="https://tiles.wmflabs.org/bw-mapnik/{z}/{x}/{y}.png"
      />
    </BaseLayer>
  </LayersControl>

**CALLS OTHER COMPONENT WHICH RENDERS FEATUREGROUP, EDITCONTROL**
**<Mapediting save={this.setSave} myIcon={myIcon} />**

  <ZoomControl position="topright" />
    <TileLayer
      attribution='&amp;copy <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
                   url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
  />
  {/* …