Narnia's Psychedelic Mushrooms

    leaflet-draw-measure
    TypeScript icon, indicating that this package has built-in type declarations

    1.1.4 • Public • Published

    使用说明:

    leaflet-draw-measure 依赖于 leaflet-measure-path 这个测量插件,此插件添加了点击绘制园,多线段,矩形,多边形动态测量,根据传递的参数显示测量结果。

    使用方法:

    1.需要先安装 leaflet-measure-path 与 leaflet-draw-measure

    npm i leaflet-measure-path
    npm i leaflet-draw-measure

    2.引入插件

    import L from "leaflet";
    import 'leaflet-measure-path'
    import 'leaflet-measure-path/leaflet-measure-path.css';
    
    <body>
        <div id="map"></div>
        <div class="tools">
            <li></li>
            <li>线</li><li>矩形</li>
            <li></li>
    
            <li>清除</li>
        </div>
    </body>
    <script type="module">
        import MeasureDraw from '../src/index.js'
        console.log(MeasureDraw);
    
        var map = L.map('map').setView([37.75, -122.23], 10);
    
        L.esri.basemapLayer('Topographic').addTo(map);
    
    
    
        const draw = new MeasureDraw({ map });
    
    
    
    
        let dom = document.getElementsByClassName('tools')[0].getElementsByTagName('li');
        dom[0].onclick = function () {
            draw.createCricle();
        }
        dom[1].onclick = function () {
            draw.createLine();
        }
        dom[2].onclick = function () {
            draw.createRectangle();
        }
        dom[3].onclick = function () {
            draw.createPolygon();
        }
        dom[4].onclick = function () {
            draw.remove();
        }
    </script>
    
    </html>
    具体请查看example文件夹下面的index.html

    Install

    npm i leaflet-draw-measure

    DownloadsWeekly Downloads

    9

    Version

    1.1.4

    License

    ISC

    Unpacked Size

    32.4 kB

    Total Files

    9

    Last publish

    Collaborators

    • a11523518