随笔分类 - leaflet
leaflet 开发学习
摘要:leaflet 自定义事件主要使用fire()方法,如下图所示,我在区域热力层点击方法中自定义一个handClick方法,并传值。 再去进行监听 预览单击就会触发我们自定义的方法
阅读全文
摘要:效果图: leaflet 有imageOverlay图层根据两个点坐标生成图像,但体验感不太好,设计上传一张图片后,常常不能对齐,就尝试自己封装个图层。如上图所示,图片有两种方式,一种方式是使用canvas createPattern方法平铺纹理,另一种是通过canvas clip剪切方法, 这个方
阅读全文
摘要:效果图: 主要使用Leaflet.Path.DashFlow动态流向线插件,可以配置每个折线的颜色,宽度。 <!DOCTYPE html> <html> <head> <title>Leaflet debug page</title> <link rel="stylesheet" href="htt
阅读全文
摘要:效果如下: leaflet生成等值面网上搜索了好多资料但测试感觉都有点瑕疵,kriging.js 生成的canvas图片每个都是小方格影响美感,turf.js会有非法Polygon且有白色缝隙。就想着可不可以使用kriging.js生成等值面,turf,js进行裁剪。 但kriging.js返回的是
阅读全文
摘要:leaflet散点图片根据官方文档我们应该都可以加载出来,点击如果想弹出简单的文本内容,title属性加载一个自定义html就可以了,但有时项目需求需要配合别的图表组件使用,简单记录下开发demo过程,下面是和Echarts折线图效果图。 创建地图容器和要显示的弹框容器 map为地图容器id,t1为
阅读全文
摘要:最近项目需求,需要使用leaflet封装成一个vue组件,涉及功能主要有高德自定义样式地图封装为leaflet底图图层、自定义坐标系、topjson省市区街道下钻、线面区域热力层、飞线、点聚合图标撒点等功能。记录下开发遇到的问题,欢迎一起交流学习。 本来使用leaflet主要用于客户本地部署加载离线
阅读全文