javascript
复制代码
const ports = {
groups: {
top: {
position: 'top',
attrs: {
circle: {
r: 4,
magnet: true,
stroke: '#cf1322',
strokeWidth: 1,
fill: '#fff',
style: {
visibility: 'visible',
},
},
},
},
right: {
position: 'right',
attrs: {
circle: {
r: 4,
magnet: true,
stroke: '#389e0d',
strokeWidth: 1,
fill: '#fff',
style: {
visibility: 'visible',
},
},
},
},
bottom: {
position: 'bottom',
attrs: {
circle: {
r: 4,
magnet: true,
stroke: '#389e0d',
strokeWidth: 1,
fill: '#fff',
style: {
visibility: 'visible',
},
},
},
},
left: {
position: 'left',
attrs: {
circle: {
r: 4,
magnet: true,
stroke: '#cf1322',
strokeWidth: 1,
fill: '#fff',
style: {
visibility: 'visible',
},
},
},
},
},
items: [
{
group: 'top',
},
{
group: 'right',
},
{
group: 'bottom',
},
{
group: 'left',
},
],
}
javascript
复制代码
Shape.HTML.register({
shape: 'html',
width: 70,
height: 36,
effect: ['data'],
html(cell) {
const { label, props } = cell.getData()
const div = document.createElement('div')
div.style.width = 70
const titleDiv = document.createElement('div')
titleDiv.style.width = '70px'
titleDiv.style.height = '36px'
titleDiv.style.background = '#eb2f96'
titleDiv.style.color = 'white'
titleDiv.style.fontSize = '14px'
titleDiv.style.textAlign = 'center'
titleDiv.style.lineHeight = '36px'
titleDiv.style.boxSizing = 'border-box'
titleDiv.style.fontSize = '12px'
titleDiv.style.borderRadius = '6px'
titleDiv.style.whiteSpace = 'nowrap'
titleDiv.style.overflow = 'hidden'
titleDiv.style.textOverflow = 'ellipsis'
titleDiv.setAttribute('title', label)
titleDiv.textContent = label
div.append(titleDiv)
return div
},
ports: {
...ports,
items: [
{
group: 'left'
},
{
group: 'right'
}
]
},
})