关于leaflet:leaflet加载本地shapefile的zip包

业务场景：通过 el-upload 上传 shapefile 的 zip 文件，而后在地图上加载
采纳了 shp.js 包

<div class="upload-file">
    <el-upload
    class="upload-demo"
    drag
    :http-request="UploadShp"
    :before-upload="onBeforeUploadImage"
    action="string"
    multiple>
    <i class="el-icon-upload"></i>
    <div class="el-upload__text"> 将文件拖到此处，或 <em> 点击上传 </em></div>
    <div class="el-upload__tip" slot="tip"> 需.zip 文件模式，至多包含.dbf、.shp、.prj 三类文件 </div>
    </el-upload>
</div>

原作者：👉👉地址：https://segmentfault.com/u/yo…
这个 shp.js 包巨坑，Readme 说是间接传 zip 的 url 或者间接本地读取到的 zip 间接传入就能够，然而把他源码拆开看须要传 arrayBuffer 格局的，而且只能传这种格局。
心愿这个包的作者看到这篇文章的时候去改一下报错提醒，或者改一下备注！！！！！太坑了

onBeforeUploadImage(file){this.fileToBuf(file)
},
fileToBuf(file){
    let that = this
    var fr = new FileReader();
    fr.readAsArrayBuffer(file);
    fr.addEventListener("loadend",(e) => {
        var buf = e.target.result;
        shp(buf).then(function(data){
            data.features.forEach(element => {
                var latlngs = element.geometry.coordinates
                let a = []
                latlngs[0].forEach(element => {a.push([element[1],element[0]])
                });
                //supermap idesktop 生成的 shepefile 的经纬度对于 leaflet 来说是反的，所以这里调整了一下
                L.polygon(a, {color: 'red',fillColor:'rgba(255,0,0,0.1)'}).addTo(that.map);
            });
        });
    },false);
},