Выделите диаграмму Санки все ссылки ⇐ Javascript

[Anonymous]

Я хочу, чтобы диаграмма Санки выделяла все вперед и обратные ссылки, связанные с узлами, на которых я пахаю.
Примеры: < /p>

< > Когда я нахожусь на природном газе узла, он должен подчеркнуть этот узел, за которым следует все прямые узлы/ссылки. Но не обратный узел, то есть чистый импорт. < /Li>
< /ol>
Неправильно выделенное изображение < /p>
При паривании над ссылкой на сетевую импорт он выделяет все правильные узлы и ссылки. Br/> реализация Fiddle: https://jsfiddle.net/g5wqpamc/
Пример кода

Код: Выделить всё

Highcharts.chart("container", {
exporting: { enabled: false },
title: {
text: null,
},
subtitle: {
text: null,
},
accessibility: {
point: {
valueDescriptionFormat:
"{index}.  {point.from} to {point.to}, " + "{point.weight}.",
},
},
plotOptions: {
sankey: {
point: {
events: {
mouseOver() {
linksHover(this, "hover", false, this.isNode)
},
mouseOut() {
linksHover(this, "")
},
},
},
},
},
tooltip: {
enabled: false,
headerFormat: undefined,
pointFormat: undefined,
nodeFormat: undefined,
},
series: [
{
keys: ["cat1", "cat2", "value"],

nodes: [
{
id: "Electricity & Heat",
color: "#ffa500",
},
{
id: "Net Import",
color: "000000",
},
{
id: "Residential",
color: "#74ffe7",
column: 2,
},
{
id: "Commercial",
color: "#8cff74",
column: 2,
},
{
id: "Industrial",
color: "#ff8da1",
column: 2,
},
{
id: "Transportation",
color: "#f4c0ff",
column: 2,
},
{
id: "Rejected Energy",
color: "#e6e6e6",
column: 3,
},
{
id: "Energy Services",
color: "#F9E79F",
column: 3,
},
{
id: "Net Import",
color: "000000",
},
{
id: "Solar",
color: "#009c00",
},
{
id: "Nuclear",
color: "#1a8dff",
},
{
id: "Hydro",
color: "#009c00",
},
{
id: "Wind",
color: "#009c00",
},
{
id: "Geothermal",
color: "#009c00",
},
{
id: "Natural Gas",
color: "#1a8dff",
},
{
id: "Biomass",
color: "#009c00",
},
{
id: "Coal",
color: "#989898",
},
{
id: "Petroleum",
color: "#989898",
offset: -1,
},
],

data: [
{
from: "Net Import",
to: "Electricity & Heat",
weight: 14,
},
{
from: "Solar",
to: "Electricity & Heat",
weight: 1.28,
},
{
from: "Nuclear",
to: "Electricity & Heat",
weight: 8.05,
},
{
from: "Hydro",
to: "Electricity & Heat",
weight: 2.31,
},
{
from: "Wind",
to: "Electricity & Heat",
weight: 3.84,
},
{
from: "Geothermal",
to: "Electricity & Heat",
weight: 0.15,
},
{
from: "Natural Gas",
to: "Electricity & Heat",
weight: 12.5,
},
{
from: "Coal",
to: "Electricity & Heat",
weight: 8.9,
},
{
from: "Biomass",
to: "Electricity & Heat",
weight: 0.41,
},
{
from: "Petroleum",
to: "Electricity & Heat",
weight: 0.24,
},
{
from: "Electricity &  Heat",
to: "Residential",
weight: 5.19,
},
{
from: "Solar",
to: "Residential",
weight: 0.4,
},
{
from: "Geothermal",
to: "Residential",
weight: 0.04,
},
{
from: "Natural Gas",
to: "Residential",
weight: 5.17,
},
{
from: "Biomass",
to: "Residential",
weight: 0.48,
},
{
from: "Petroleum",
to: "Residential",
weight: 0.98,
},
{
from: "Electricity & Heat",
to: "Commercial",
weight: 4.69,
},
{
from: "Solar",
to: "Commercial",
weight: 0.16,
},
{
from: "Geothermal",
to: "Commercial",
weight: 0.02,
},
{
from: "Natural Gas",
to: "Commercial",
weight: 3.65,
},
{
from: "Coal",
to: "Commercial",
weight: 0.02,
},
{
from: "Biomass",
to: "Commercial",
weight: 0.15,
},
{
from: "Petroleum",
to: "Commercial",
weight: 0.88,
},
{
from: "Electricity & Heat",
to: "Industrial",
weight: 3.44,
},
{
from: "Solar",
to: "Industrial",
weight: 0.04,
},
{
from: "Natural Gas",
to: "Industrial",
weight: 10.8,
},
{
from: "Coal",
to: "Industrial",
weight: 0.99,
},
{
from: "Biomass",
to: "Industrial",
weight: 2.27,
},
{
from: "Petroleum",
to: "Industrial",
weight: 9.13,
},
{
from: "Electricity & Heat",
to: "Transportation",
weight: 0.02,
},
{
from: "Natural Gas",
to: "Transportation",
weight: 1.29,
},
{
from: "Biomass",
to: "Transportation",
weight: 1.57,
},
{
from: "Petroleum",
to: "Transportation",
weight: 24.6,
},
{
from: "Petroleum",
to: "Plastics & Rubbers",
weight: 50,
},
{
from: "Plastics & Rubbers",
to: "Waste Products",
weight: 100,
},
{
from: "Waste Products",
to: "Pollutions",
weight: 200,
},
{
from: "Electricity &  Heat",
to: "Rejected Energy",
weight: 24.3,
},
{
from: "Residential",
to: "Rejected Energy",
weight: 4.29,
},
{
from: "Commercial",
to: "Rejected Energy",
weight: 3.35,
},
{
from: "Industrial",
to: "Rejected Energy",
weight: 13.6,
},
{
from: "Transportation",
to: "Rejected Energy",
weight: 21.7,
},
{
from: "Residential",
to: "Energy Services",
weight: 7.97,
},
{
from: "Commercial",
to: "Energy Services",
weight: 6.22,
},
{
from: "Industrial",
to: "Energy Services",
weight: 13.1,
},
{
from: "Transportation",
to: "Energy Services",
weight: 5.77,
},
],
type: "sankey",
name: "Sankey demo series",
},
],
})

function linksHover(point, state, fromNode, isInitialStateNode) {
if (point.isNode) {
if (
point?.series?.options?.columns?.length - 1 === point.column &&
isInitialStateNode
) {
fromNode = true
}
if (fromNode) {
point.linksTo.forEach(function (l) {
l.setState(state)
if (!l.isNode) {
linksHover(l.fromNode, state, true)
}
})
} else {
point.linksFrom.forEach(function (l) {
l.setState(state)
if (!l.isNode) {
linksHover(l.toNode, state, false)
}
})
}
} else {
linksHover(point.toNode, state, false)
linksHover(point.fromNode, state, true)
}
}

Я попытался изменить логику функции, но она разбивается для некоторых случаев, как показано на изображении 1.


Подробнее здесь: https://stackoverflow.com/questions/794 ... ward-links