当尝试将 cytoscape.js 中的节点形状设置为 roundrectangle 时，我只能得到一个正常的矩形，没有圆角。我什至在 cytoscape.js 的“实时代码示例”中尝试过。代码如下:
$(loadCy = function(){
options = {
showOverlay: false,
minZoom: 0.5,
maxZoom: 2,
style: cytoscape.stylesheet()
.selector('node')
.css({
'content': 'data(name)',
'font-family': 'helvetica',
'font-size': 14,
'text-outline-width': 3,
'text-outline-color': '#888',
'text-valign': 'center',
'color': '#fff',
'width': 'mapData(weight, 30, 80, 20, 50)',
'height': 'mapData(height, 0, 200, 10, 45)',
'border-color': '#fff',
'shape':'roundrectangle'
})
.selector(':selected')
.css({
'background-color': '#000',
'line-color': '#000',
'target-arrow-color': '#000',
'text-outline-color': '#000'
})
.selector('edge')
.css({
'width': 2,
'target-arrow-shape': 'triangle'
})
,
elements: {
nodes: [
{
data: { id: 'j', name: 'Jerry', weight: 65, height: 174 }
},
{
data: { id: 'e', name: 'Elaine', weight: 48, height: 160 }
},
{
data: { id: 'k', name: 'Kramer', weight: 75, height: 185 }
},
{
data: { id: 'g', name: 'George', weight: 70, height: 150 }
}
],
edges: [
{ data: { source: 'j', target: 'e' } },
{ data: { source: 'j', target: 'k' } },
{ data: { source: 'j', target: 'g' } },
{ data: { source: 'e', target: 'j' } },
{ data: { source: 'e', target: 'k' } },
{ data: { source: 'k', target: 'j' } },
{ data: { source: 'k', target: 'e' } },
{ data: { source: 'k', target: 'g' } },
{ data: { source: 'g', target: 'j' } }
],
},
ready: function(){
cy = this;
}
};
$('#cy').cytoscape(options);
});
有什么帮助吗？
最佳答案
虽然它被记录在案，但显然渲染器中缺少一些东西。正在调查中。 -最大限度
关于svg - Cytoscape.js 如何将节点塑造为圆形矩形？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17492943/