0

我已经尝试提供以下属性，但它不起作用。

obj.attrs.text["ref"] = 'rect';
obj.attrs.text["ref-dx"] = .5;
obj.attrs.text["ref-y"] = 0;
obj.attrs.text["x-alignment"] = "middle";
obj.attrs.text["y-alignment"] = "middle";

我正在使用 svg 标记，它是一个矩形，但是当我更改上述属性时，光环处理程序也会受到影响，而不会影响光环处理程序如何在 sv 标记下显示文本

4

1 回答 1

1

如果您尝试创建类型为：的新模板形状basic.Circle：

new joint.shapes.basic.Circle({
        size: { width: 5, height: 3 },
        attrs: {
            circle: { width: 50, height: 30, fill: '#602320' },
            text: { text: 'START', fill: '#ffffff', 'font-size': 10, stroke: '#000000', 'stroke-width': 0 }
        }
    })

然后您可以根据必须访问的 JSON 结构设置一些属性。

例如通过设置：

cell.attr('text/text', 'My sample text');

您可以对此形状进行以下更改：

new joint.shapes.basic.Circle({
        size: { width: 5, height: 3 },
        attrs: {
            circle: { width: 50, height: 30, fill: '#602320' },
            text: { text: 'My sample text', fill: '#ffffff', 'font-size': 10, stroke: '#000000', 'stroke-width': 0 }
        }
    })

您还可以通过设置更改形状的第一个 JSON 级别：

cell.set('some_first_level_attribute', 'value of some_first_level_attribute');

尝试console.log您cell以查看和理解您要设置的每个单元格的确切 JSON 格式。

单元格的典型 JSON 可以是以下 JSON：

{
    "type": "basic.Circle",
    "size": {
        "width": 85,
        "height": 51
    },
    "position": {
        "x": 0,
        "y": 340
    },
    "angle": 0,
    "id": "b3810f0f-00e1-4fde-a448-0966da71e285",
    "embeds": "",
    "z": 1,
    "attrs": {
        "circle": {
            "fill": "#602320",
            "width": 50,
            "height": 30,
            "stroke-width": 1,
            "stroke-dasharray": "0"
        },
        "text": {
            "font-size": 10,
            "text": "My sample text",
            "fill": "#ffffff",
            "font-family": "Arial",
            "stroke": "#000000",
            "stroke-width": 0,
            "font-weight": 400
        }
    }
}
于 2018-04-27T08:55:08.447 回答