首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >带点击事件的传单Vectorgrid问题

带点击事件的传单Vectorgrid问题
EN

Stack Overflow用户
提问于 2022-09-23 21:27:46
回答 1查看 101关注 0票数 0

我正在使用Vue3 + Vite,并试图使leaflet.vectorgrid与我的地图一起工作。我快到了,我可以使用以下代码正确显示topojson文件:

代码语言:javascript
复制
fetch('./mytopo.json').then(function(response){
        return response.json();
      }).then(function(json){
        var vectorGrid = L.vectorGrid.slicer( json, {
          rendererFactory: L.canvas.tile,
          interactive: true,
          minZoom: 10,
          maxZoom: 12,
          vectorTileLayerStyles: {
            'reduced2': function(properties, zoom) {
              //console.log(properties);
              var gradient = hslToHex(percent,100,50);
              return {
                fillColor: gradient,
                fillOpacity: 0.5,
                stroke: true,
                fill: true,
                color: 'black',
                weight: 1,
              }
            }
          }
        }).addTo(map);

但是,当我添加以下代码来捕捉点击时,我会得到一个错误:

代码语言:javascript
复制
**Uncaught TypeError: L.DomEvent.fakeStop is not a function
    at NewClass._onClick (Leaflet.VectorGrid.bundled.min.js:2:15768)
    at HTMLCanvasElement.handler (DomEvent.js:108:13)
Leaflet.VectorGrid.bundled.min.js:2** 

事件代码:

代码语言:javascript
复制
vectorGrid.on('click', function(e) {
          L.popup()
          .setContent('<p>Hello world!<br />This is a nice popup.</p>')
          .setLatLng(e.latlng)
          .openOn(map)
        });

知道发生了什么吗?我怀疑有配置/版本问题..。以下是我的应用程序组件:

代码语言:javascript
复制
@geoman-io/leaflet-geoman-free@2.13.0
├── @popperjs/core@2.11.6
├── @vitejs/plugin-vue@3.0.3
├── @vue-leaflet/vue-leaflet@0.6.1
├── axios@0.27.2
├── bootstrap@5.2.0
├── https@1.0.0
├── leaflet-fullscreen@1.0.2
├── leaflet-sidebar@0.2.4
├── leaflet.markercluster@1.5.3
├── leaflet.vectorgrid@1.3.0
├── leaflet@1.9.1
├── sass-loader@13.0.2
├── sass@1.54.9
├── topojson-client@3.1.0
├── vite-plugin-mkcert@1.9.0
├── vite-plugin-rewrite-all@1.0.0
├── vite@3.0.9
├── vue-google-charts@1.1.0
├── vue-gtag@2.0.1
├── vue-router@4.1.5
└── vue@3.2.38

编辑:我做了一些测试,它在传单1.7.1中运行得很好,但对1.8+却不起作用。Leaflet1.8+似乎不再存在fakestop函数。知道怎么解决这个问题吗?

非常感谢亚历克斯

EN

回答 1

Stack Overflow用户

发布于 2022-09-26 08:28:10

最后,我自己找到了一个肮脏的修补程序,在代码中添加了以下一行,以创建缺少的函数:

代码语言:javascript
复制
L.DomEvent.fakeStop = function () {
  return true;
}

我希望它能帮助别人!

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/73833142

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档