简体   繁体   English

在 cytoscapeJs 中设置节点样式

[英]Setting node style in cytoscapeJs

As you can see below not all the node style that i declare are working.正如您在下面看到的,并非我声明的所有节点样式都有效。 I want to make the text inside the node larger and in the documentation i found the code: 'labelFontSize': 100. Than, i want to make the edge weight (that you cannot see in the picture but are present) white, and the code "labelFontColor": "white" isn't working.我想让节点内的文本更大,在文档中我找到了代码:'labelFontSize':100。然后,我想让边缘权重(你在图片中看不到但存在)白色,并且代码“labelFontColor”:“white”不起作用。 I am using CytoscapeJs.我正在使用 CytoscapeJs。

Can someone explain to me why this happen?有人可以向我解释为什么会这样吗?

My code is the following:我的代码如下:

            var json_obj = response.Cy_json_archi_prima_di_chiusura_atk_supp
            var cy = cytoscape({
                container: document.getElementById('cy_atk_supp'),
                elements:  JSON.parse(json_obj),
                style: [
                {
                  selector: 'node',
                  style: {
                    'shape': 'circle',
                    'labelFontSize': 100,
                    'label': 'data(label)',
                    'text-valign': 'center',
                    'text-halign': 'center',
                    'color': 'black',
                    "height": 150,
                    "width": 150,
                    'border-width': '2px',
                    'border-color': 'black',
                    'background-color': '#399AF9'
                    //'font-size': 20
                  }

                }, 
                {
                  selector: 'edge',
                  style:{
                    'label': 'data(weight)',
                    'labelFontSize': 300,
                    "labelFontColor": "white",
                    'labelFontWeight': 'bold',
                    'lineColor': 'data(color)',
                    'width': 3,
                    'target-arrow-color': 'data(color)',
                    "curve-style": "bezier",
                    'target-arrow-shape': 'triangle',

                  }
                }
                ],
                layout: {
                    name : 'circle'
                }
            });

And this is the resulting Graph:这是结果图:

在此处输入图像描述

I was checking the wrong library.我检查了错误的库。

For cytoscapeJS these is the correct style option: https://js.cytoscape.org/#style/labels对于 cytoscapeJS,这些是正确的样式选项: https://js.cytoscape.org/#style/labels

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM