美文网首页
vue+leaflet加载超图显示不完全

vue+leaflet加载超图显示不完全

作者: 最慢的是活着 | 来源:发表于2021-11-30 16:23 被阅读0次

    vue+leaflet加载地图根据示例代码只引入了如下模块:

    import L from 'leaflet';
    import '@supermap/iclient-leaflet';
    

    地图展示不完全如下:


    截屏2021-11-30 下午4.12.39.png

    后来发现是缺失leaflet的css引入
    首先找到package.json
    查看是否添加了leaflet的依赖
    如果只执行了

    npm install @supermap/iclient-leaflet
    

    这个是不够的。还需要执行

    npm install  leaflet
    

    再引入leaflet.css

    import "leaflet/dist/leaflet.css";
    

    如果保存之后地图可以显示出来,但是刷新之后地图又无法完整加载,就需要考虑是不是使用了tab切换,或者使用v-show之类的展示地图。
    如果是这样的问题,需要考虑到是否是因为v-show或者他不切换时拿不到地图DOM导致的地图加载不完全,我将模块v-show的控制方法,改成v-if,地图成功展示。
    在此记录一下


    截屏2021-11-30 下午4.20.54.png

    相关文章

      网友评论

          本文标题:vue+leaflet加载超图显示不完全

          本文链接:https://www.haomeiwen.com/subject/whsdxrtx.html