Custom image for every node in Network graph

[swarupbam]

Hi, I have a couple of questions.

1. Is it possible to have a custom image as a node shape? Like different symbols circles, squares I would like to put a custom image on an individual node.
2. Is it possible to implement the drill-down functionality on the node? Let's say clicking on the node should display its child nodes. I have seen some fiddles but wanted to check if HighCharts supports it natively.

Thanks.

[sebastian.h]

Hi,
We appreciate you reaching out to us.

Do you mean something like this organization chart?
https://www.highcharts.com/demo/organization-chart

About drilldown, there isn't functionality such this as for network graph but the inside this topic is a possible workaround, you can check.
viewtopic.php?f=9&t=42543

I'm waiting for news from you.
Best regards.

[swarupbam]

Hi Sebastian,

Yes, somewhat like the organization chart. What I am looking for is, the node itself should be an image. Instead of circles, squares, etc, images should appear as nodes. Something like this - https://cacoo.com/assets/site/img/templ ... etwork.png

Thank you.

[sebastian.h]

Hi,
Thanks for message.

You can't exactly set the whole nodes as images but you have the possible customization like change options nodes.color to white.
This is one idea of how you can achieve something similar to custom images that will pretend to be nodes

API References:
https://api.highcharts.com/highcharts/s ... tion.color

Live demo:
https://jsfiddle.net/BlackLabel/dmcsj8tz/

Let me know how are you going with this
Best regards.

[swarupbam]

Hi Sebastian,

Thanks for the inputs. Whatever you have sent, it is possible to implement the same in the network graph? So basically white color and custom image to the node.

Regards,
Swarup

[sebastian.h]

Hi,
This trick can only be done in a type chart organization, a network chart is built differently.

Best regards.

[nithinbabu]

nodes: [
{
id: "Shareholders"
},
{
id: "Board"
},
{
id: "CEO",

name: "Grethe Hjetland",
height: 70,


},
{
id: "HR",

name: "Anne Jorunn Fjærestad",
color: "#007ad0",
offset: "85%",
height: 70
},
{
id: "CTO",
height: 70,
name: "Christer Vasseng",
column: 4,

layout: "hanging"
},
{
id: "CPO",
height: 70,
name: "Torstein Hønsi",
column: 4,

},
{
id: "CSO",
height: 70,
name: "Anita Nesse",
column: 4,

layout: "hanging"
},
{
id: "CMO",
height: 70,
name: "Vidar Brekke",
column: 4,

layout: "hanging"
},
{
id: "Product",
name: "Product developers",
height: 70
},

[mateusz.b]

Hi nithinbabu,

Welcome to our forum and thanks for contacting us with your question!

Please create a live demo with your chart and describe what precisely would you like to change. You can start here:
https://jsfiddle.net/BlackLabel/Lcf36abd/

Regards!