Leaflet 如何使传单多段线更'；可触摸'；还是友好的？

我使用传单呈现GEOJSON，包括各种线字符串。无论出于什么原因，我很少能让触控事件起作用。就像在中一样，很难让手指真正对准屏幕上的正确位置

这是我的地图：

return (
        <Map
            style={{
                height: '100%',
                width: '100%',
                margin: '0 auto'
            }}
            onClick={this.closeAllMapPopups}
            ref={(el) => {
                this.leafletMap = el;
            }}
            center={position}
            zoom={9}>
            <TileLayer url='https://api.mapbox.com/v4/mapbox.outdoors/{z}/{x}/{y}@2x.png?access_token=pk.eyJ1IjoiYawefawelbnMyNCIsImawefbDRtMzcwMDNmMzJydHdvcjF6ODA5In0.xdZi4pmkhj1zb9Krr64CXw' attribution='&copy; <a href="https://www.mapbox.com/about/maps/">Mapbox</a>' />
            <GeoJSON data={locations} ref="geojson" style={this.getStyle} onEachFeature={this.onEachFeature} 

            />{' '}
        </Map>

触摸事件（click=tap）似乎只有在我运气好的时候才起作用。如何使传单多段线更易于单击

探索了插件选项，但大多数已过时：

使用（即在实例化渲染器或渲染器时使用

公差

选项）。该选项的值以像素为单位

e、 g.取并包括一个

公差
：

var map = L.map('map');
var myRenderer = L.canvas({ padding: 0.5, tolerance: 20 });
var line = L.polyline( coordinates, { renderer: myRenderer } );

var map = L.map('map');
var myRenderer = L.canvas({ padding: 0.5, tolerance: 20 });
var line = L.polyline( coordinates, { renderer: myRenderer } );