Javascript cytoscape.js中标签文本的多个数据值

我正在尝试向cytoscape.js中的标签添加多个值，如下所示-

{
    "selector": "edge",
    "style": {
        "curve-style": "haystack",
        "text-wrap": "wrap",
        "label": "data(count)" + "data(edgevalue)",
        "font-size": "8px",
        "color": "black",
        "haystack-radius": "0.5",
        "opacity": "0.4",
        "line-color": "#bbb",
        "width": "mapData(weight, 0, 1, 1, 8)",
    }
},

然而，这只是字面上的显示-

data(count)data(edgevalue)

作为标签文本。如果我删除其中一个，它会为每个打印正确的值。 我尝试为换行符添加“\n”，这创建了换行符，但值与上面的值相同

我还尝试了datacount+edgevalue，但没有成功

---

如何在标签文本中实现多个数据属性？

您可以使用映射器将正确的数据导入样式：

此外，我通常使用：

在这里，您可以看到一个简单的示例：

document.AddEventListenerDomainContentLoaded，函数{ var cy=window.cy=cytoscape{ 容器：document.getElementById， //演示您的布局 布局：{ 姓名：klay //这里有更多的选择。。。 }, 风格：[{ 选择器：节点， 风格：{ 背景色：dd4de2 } }, { 选择器：。叶， 风格：{ 背景颜色：000 } }, { 选择器：边， 风格：{ 曲线样式：贝塞尔， 目标箭头形状：三角形， 线条颜色：dd4de2， 目标箭头颜色：dd4de2， 不透明度：0.5， 标签：functionnode{ 返回`${node.datasource}->${node.datatarget}` } } } ], 要素：{ 节点：[{ 数据：{ id:n0 } }, { 数据：{ id:n1 } }, { 数据：{ id:n2 } }, { 数据：{ 编号：n3 } }, { 数据：{ 编号：n4 } }, { 数据：{ 编号：n5 } }, { 数据：{ 编号：n6 } }, { 数据：{ 编号：n7 } }, { 数据：{ 编号：n8 } }, { 数据：{ 编号：n9 } }, { 数据：{ 编号：n10 } }, { 数据：{ 编号：n11 } }, { 数据：{ 编号：n12 } }, { 数据：{ 编号：n13 } }, { 数据：{ 编号：n14 } }, { 数据：{ 编号：n15 } } ], 边缘：[{ 数据：{ 资料来源：n0， 目标：n1 } }, { 数据：{ 资料来源：n1， 目标：n2 } }, { 数据：{ 资料来源：n1， 目标：n3 } }, { 数据：{ 资料来源：n2， 目标：n4 } }, { 数据：{ 资料来源：n4， 目标：n5 } }, { 数据：{ 资料来源：n4， 目标：n6 } }, { 数据：{ 资料来源：n6， 目标：n7 } }, { 数据：{ 资料来源：n6， 目标：n8 } }, { 数据：{ 资料来源：n8， 目标：n9 } }, { 数据：{ 资料来源：n8， 目标：n10 } }, { 数据：{ 资料来源：n10， 目标：n11 } }, { 数据：{ 资料来源：n11， 目标：n12 } }, { 数据：{ 资料来源：n12， 目标：n13 } }, { 数据：{ 资料来源：n13， 目标：n14 } }, { 数据：{ 资料来源：n13， 目标：n15 } } ] } }; cy.nodes.leaves.addClassleaf； }; 身体{ 字体系列：helvetica neue、helvetica、liberation sans、arial、sans serif； 字体大小：14px； } 赛义德{ 位置：绝对位置； 左：0； 排名：0； 底部：0； 右：0； z指数：999； }

---

可以使用映射器将正确的数据导入样式：

此外，我通常使用：

在这里，您可以看到一个简单的示例：

document.AddEventListenerDomainContentLoaded，函数{ var cy=window.cy=cytoscape{ 容器：document.getElementById， //演示您的布局 布局：{ 姓名：klay //这里有更多的选择。。。 }, 风格：[{ 选择器：节点， 风格：{ 背景色：dd4de2 } }, { 选择器：。叶， 风格：{ 背景颜色：000 } }, { 选择器：边， 风格：{ 曲线样式：贝塞尔， 目标箭头形状：三角形， 线条颜色：dd4de2， 目标箭头颜色：dd4de2， 不透明度：0.5， 标签：functionnode{ 返回`${node.datasource}->${node.datatarget}` } } } ], 要素：{ 节点：[{ 数据：{ id:n0 } }, { 数据：{ id:n1 } }, { 数据：{ id:n2 } }, { 数据：{ 编号：n3 } }, { 数据：{ 编号：n4 } }, { 数据：{ 编号：n5 } }, { 数据：{ 编号：n6 } }, { 数据：{ 编号：n7 } }, { 数据：{ 编号：n8 } }, { 数据：{ 编号：n9 } }, { 数据：{ 编号：n10 } }, { 数据：{ 编号：n11 } }, { 数据：{ 编号：n12 } }, { 数据：{ 编号：n13 } }, { 数据：{ 编号：n14 } }, { 数据：{ 编号：n15 } } ], 边缘：[{ 数据：{ 资料来源：n0， 目标：n1 } }, { 数据：{ 资料来源：n1， 目标：n2 } }, { 数据：{ 资料来源：n1， 目标：n3 } }, { 数据：{ 资料来源：n2， 目标：n4 } }, { 数据：{ 资料来源：n4， 目标：n5 } }, { 数据：{ 资料来源：n4， 目标：n6 } }, { 数据：{ 资料来源：n6， 目标：n7 } }, { 数据：{ 资料来源：n6， 目标：n8 } }, { 数据：{ 资料来源：n8， 目标：n9 } }, { 数据：{ 资料来源：n8， 目标：n10 } }, { 数据：{ 资料来源：n10， 目标：n11 } }, { 数据：{ 资料来源：n11， 目标：n12 } }, { 数据：{ 资料来源：n12， 目标：n13 } }, { 数据：{ 资料来源：n13， 目标：n14 } }, { 数据：{ 资料来源：n13， 目标：n15 } } ] } }; cy.nodes.leaves.addClassleaf； }; 身体{ 字体系列：helvetica neue、helvetica、liberation sans、arial、sans serif； 字体大小：14px； } 赛义德{ 位置：绝对位置； 左：0； 排名：0； 底部：0； 右：0； z指数：999； }

{
    label: function (element) { 
        return `${element.data("attribute_01")} + ${element.data("attribute_02")}`
    }
}