Question

我正在与Highcharts合作。我需要像jsFiddle示例中那样绘制死锁图：https://jsfiddle.net/1wksg5jn/263/，并增加了缩放功能。代替这个：

ren.label('Server process id: 2<br/>Server batch Id:2<br/>Execution context:<br/>Deadlock', 440, 120)
    .attr({
        fill: 'transparent',
        stroke: 'black',
        padding: 20,
        r: 80
    })
    .add()
    .shadow(true);

ren.label('Key lock: 1', 240, 70)
    .attr {
        r: 2,
        width: 105,
        height: 70,
        fill: 'lightgray'
    })
.add();

我想使用具有以下功能的函数绘制死锁图元素：

function DrawEllipse(label, positionX, positionY) {
    .attr({
        fill: 'transparent',
        stroke: 'black',
        padding: 20,
        r: 80
    }).add();
}

function DrawKeyLockTable(label, positionX, positionY) {
    .attr({
        r: 2,
        width: 105,
        height: 70,
        fill: 'lightgray'
    }).add();
}

并在我的代码中调用此函数。

Answer 1

您可以通过以下方式创建函数来绘制SVG元素：

function drawEllipse(label, positionX, positionY) {
    ren.label(label, positionX, positionY).attr({
        r: 80,
        padding: 20,
        width: 105,
        height: 70,
        fill: 'lightgray'
    }).add();
}

function drawKeyLockTable(label, positionX, positionY) {
    ren.label(label, positionX, positionY).attr({
        r: 2,
        width: 105,
        height: 70,
        fill: 'lightgray'
    }).add();
}

实时演示：https://jsfiddle.net/BlackLabel/7sympovh/

绘制死锁图（使用函数）并增加了缩放功能

1 个答案: