0.3.2 • Published 1 year ago
vue2-hotmap v0.3.2
图片热区点击
基于 vue-hotzone 二次定制
Install
npm install vue2-hotmap --save
# or
yarn add vue2-hotmapUse
// Use in component
import hotmap from 'vue2-hotmap'
export default {
components: {
hotmap
}
}
// Use in global
import hotmap from 'vue2-hotmap'
Vue.component(hotmap.name, hotmap)
// or
Vue.use(hotmap)<hotmap [options]></hotmap>Options
Attributes
You can set them to your data function
| Attribute | Type | Description | Keys |
|---|---|---|---|
| image | String | image of hotzone(required: true) | |
| max | Number | max number of zones | |
| zonesInit | Array | init zones | item(heightPer, leftPer, topPer, widthPer) |
Events
| Event Name | Description | Parameters |
|---|---|---|
| change | triggers when the zones changes | the array of the zones |
| add | triggers when the zone add | the add zone item |
| remove | triggers when the zone remove | the index of the remove zone |
| overRange | triggers when zones number > max | the index of the overRange zone |
| erase | triggers when add zone overRange or smaller than the minimum area(48*48) | the index of the erase zone |
License
MIT