57 lines
1.6 KiB
JavaScript
57 lines
1.6 KiB
JavaScript
/**
|
|
* @author: clay
|
|
* @data: 2019/08/15
|
|
* @description: 画锚点
|
|
*/
|
|
|
|
import theme from '@/views/custom-query/topo/top/theme'
|
|
export default function(cfg, group) {
|
|
const themeStyle = theme.defaultStyle // todo...先使用默认主题，后期可能增加其它风格的主体
|
|
let { anchorPoints, width, height, id } = cfg
|
|
if (anchorPoints && anchorPoints.length) {
|
|
for (let i = 0, len = anchorPoints.length; i < len; i++) {
|
|
let [x, y] = anchorPoints[i]
|
|
// 计算Marker中心点坐标
|
|
let anchorX = x * width
|
|
let anchorY = y * height
|
|
// 添加锚点背景
|
|
let anchorBgShape = group.addShape('marker', {
|
|
id: id + '_anchor_bg_' + i,
|
|
attrs: {
|
|
name: 'anchorBg',
|
|
x: anchorX,
|
|
y: anchorY,
|
|
// 锚点默认样式
|
|
...themeStyle.anchorBgStyle.default
|
|
},
|
|
draggable: false,
|
|
name: 'markerBg-shape'
|
|
})
|
|
// 添加锚点Marker形状
|
|
let anchorShape = group.addShape('marker', {
|
|
id: id + '_anchor_' + i,
|
|
attrs: {
|
|
name: 'anchor',
|
|
x: anchorX,
|
|
y: anchorY,
|
|
// 锚点默认样式
|
|
...themeStyle.anchorStyle.default
|
|
},
|
|
draggable: false,
|
|
name: 'marker-shape'
|
|
})
|
|
|
|
anchorShape.on('mouseenter', function() {
|
|
anchorBgShape.attr({
|
|
...themeStyle.anchorBgStyle.active
|
|
})
|
|
})
|
|
anchorShape.on('mouseleave', function() {
|
|
anchorBgShape.attr({
|
|
...themeStyle.anchorBgStyle.inactive
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}
|