基于fabric的地图定位，SVG热力地图

基于fabric的地图定位，SVG热力地图

基于fabric的地图定位，SVG热力地图

基于 fabricjs v2.4.5 开发，热力图基于 heatmap.js v2.0.5+ 开发，依赖 Vue.js v2.2.6+.

GITHUB项目地址

https://github.com/nqdy666/fabric-map-vue

特性

• 热力地图
• 地图定位
• 距离绘制
• 地图切换
• Auto resize

文档

• Demo
• Example on JSBin

功能预览

热力地图 示例源码

热力地图

缩放类型 示例源码

缩放类型

地图定位 示例源码

[图片上传失败...(image-2c59cd-1563270407185)]

距离绘制 示例源码

距离绘制

地图切换 示例源码

地图切换

背景设置 示例源码

背景设置

安装

NPM

安装npm包.

$ npm install fabric-map-vue

先需要引用fabric.js

组件注册

import Vue from 'vue'
import FabricMapVue from 'fabric-map-vue'
Vue.use(FabricMapVue)

现在可以使用该组件

CDN

包含 vue 、fabric.js、heatmap.js、 fabric-map-vue.js、fabric-map-vue.css

现在可以使用该组件