vue-map-sense

概述

图片缩放, 支持画框，轨迹动画等

配置

|属性|说明|类型|必填|可选值|默认值| |---|---|---|---|---|---| |src|图片|String|必填|/|/| |layers|展示层|Array|非必填|["live","device","fence","point"]|["fence", "device"]| |deviceType|设备类型|Array|非必填|["camera","track"]|["camera]| |enableZoom|支持放大|Boolean|非必填|true/false|true| |fenceData|fence数据（依赖fence layer）|Array|非必填|/|[]| |liveData|live数据（依赖live layer）|Array|非必填|/|[]| |deviceData|device数据（依赖device layer）|Array|非必填|/|[]| |pointData|point数据（依赖point layer）|Array|非必填|/|[]| |mapScale|地图缩放比|Number|非必填|/|1| |zoneColor|区域颜色（依赖fence layer）|String|非必填|/|#52da89| |fenceColor|围栏颜色（依赖fence layer）|String|非必填|/|#007fff| |padding|边距|Number|非必填|/|20| |liveImgs|live图标（依赖live layer）|Array|非必填|/|[]| |currentScale|原始缩放比（依赖live layer）|Number|非必填|/|1|

使用

# 全局加载 main.js

import SenseMap from "vue-map-sense";

Vue.use(SenseMap);


# 按需加载
import { SenseMap } from "vue-map-sense";


<sense-map 
  src="https://hbimg.huabanimg.com/2bc7d142a0c4118c963cef5823420b67e88b40e6d202-haqV2l_fw236/format/webp"
/>