How to add html text to label text?

[KoNGoL]

I need to modify the label text so I can change the color for each line of the text. It is possible to achive? Adding some html or css text?

[mojoaxel]

Please have a look at the customCss Example. Here the content includes html tags and css.

To change the color you could use css or something like this:

<ul>
  <li style="color:black;">line1</li>
  <li style="color:red;">line2</li>
  <li style="color:yellow;">line3</li>
</ul>

[KoNGoL]

It doesn't work for me. This is what I try.

And this is the vis options.

var optionsFA = {
                autoResize: true,
                height: '500px',
                layout: {
                    hierarchical: {
                        sortMethod: 'directed',
                        direction: 'RL',
                        levelSeparation: 250
                    }
                },
                nodes: {
                    shadow:true,
                    font: '12px arial black'
                },

                edges: {
                    width: 2,
                    shadow:true,
                    color: '#7f92a3',
                    smooth: {enabled: true,
                        roundness: 0.4}
                },

                groups: {
                    industry: {
                        shape: 'icon',
                        icon: {
                            face: 'FontAwesome',
                            code: '\uf275',
                            size: 50,
                            color: '#1e5eaf'
                        }
                    },
                    users: {
                        shape: 'icon',
                        icon: {
                            face: 'FontAwesome',
                            code: '\uf0c0',
                            size: 40,
                            color: '#1e5eaf'
                        }
                    },
                    supplier1: {
                        shape: 'icon',
                        icon: {
                            face: 'FontAwesome',
                            code: '\uf275',
                            size: 40,
                            color: '#1e5eaf'
                        }
                    },
                    supplier2: {
                        shape: 'icon',
                        icon: {
                            face: 'FontAwesome',
                            code: '\uf275',
                            size: 30,
                            color: '#1e5eaf'
                        }
                    },
                    supplier3: {
                        shape: 'icon',
                        icon: {
                            face: 'FontAwesome',
                            code: '\uf275',
                            size: 20,
                            color: '#1e5eaf'
                        }
                    }
                }
            };

And the nodes creation.

nodes.push({
                    id: company.IdEmpresa,
                    label: "<p>" + company.Nombre + "<br/>Inventario: " + currentInvetory + "</p>",
                    group: company.IdCliente == 0? "industry": "supplier1",
                    name: company.Nombre,
});
network = new vis.Network($('#networkContainer')[0], dataFA, optionsFA);

Any suggestions?

[mojoaxel]

It looks like HTML-labels are not possible for network charts at the moment.

Simple multiline labels are possible: multilineText and disassemblerExample, but I could not find a way of changing colors inside a label.

I created a new Feature Request for that: #1965

[mojoaxel]

@KoNGoL Can we close this issue? CSS in Labels is just not possible at the moment.

[mojoaxel]

(kind of) implemented by @eymiha with #2385