kurkle · kurkle · Oct 27, 2024 · Oct 27, 2024
diff --git a/samples/parsing.html b/samples/parsing.html
@@ -0,0 +1,43 @@
+
+<!doctype html>
+<html>
+
+<head>
+	<title>Sankey diagram</title>
+	<script src="utils.js"></script>
+	<link rel="stylesheet" type="text/css" href="style.css">
+	</link>
+</head>
+
+<body>
+	<div class="canvas-holder">
+		<canvas id="chart-area"></canvas>
+	</div>
+
+	<script>
+		Utils.load(() => {
+			Chart.defaults.font.size = 9;
+			const ctx = document.getElementById('chart-area').getContext('2d');
+			window.chart = new Chart(ctx, {
+				type: 'sankey',
+				data: {
+					datasets: [{
+						data: [
+							{source: 'a', dest: 'b', value: 20},
+							{source: 'c', dest: 'd', value: 10},
+							{source: 'c', dest: 'e', value: 5},
+						],
+						parsing: { from: 'source', to: 'dest', flow: 'value' }
+					}],
+				},
+				options: {
+					animation: false,
+					responsive: false
+				}
+			});
+
+		});
+	</script>
+</body>
+
+</html>
diff --git a/src/controller.ts b/src/controller.ts
@@ -87,8 +87,8 @@
             return ''
           },
           label(context) {
-            const item = context.dataset.data[context.dataIndex]
-            return item.from + ' -> ' + item.to + ': ' + item.flow
+            const parsedCustom = context.parsed._custom
+            return parsedCustom.from.key + ' -> ' + parsedCustom.to.key + ': ' + parsedCustom.flow
           },
         },
       },
@@ -128,7 +128,7 @@
  private _maxX: number
  private _maxY: number

  override parseObjectData(
    meta: ChartMeta<'sankey', Flow>,
    data: AnyObject[],
    start: number,
@@ -183,6 +183,7 @@
           x: xScale.parse(to.x, i) as number,
           y: yScale.parse(toY, i) as number,
           height: yScale.parse(dataPoint.flow, i) as number,
+          flow: dataPoint.flow,
         },
       })
     }
@@ -241,7 +242,7 @@
    this.updateSharedOptions(sharedOptions, mode, firstOpts)
  }

  private _drawLabels() {
    const ctx = this.chart.ctx
    const options = this.options
    const nodes = this._nodes || new Map()
@@ -297,7 +298,7 @@
    }
  }

  private _drawNodes() {
    const ctx = this.chart.ctx
    const nodes = this._nodes || new Map()
    const { borderColor, borderWidth = 0, nodeWidth = 10, size } = this.options

diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts
@@ -51,7 +51,7 @@
    addY: number
    flow: number
    key: string
    node: SankeyNode
    index: number
  }

@@ -84,6 +84,7 @@
       x: number
       y: number
       height: number
+      flow: number
     }
   }
 
@@ -94,7 +95,7 @@
      parsedDataType: SankeyParsedData
      metaExtensions: AnyObject
      /* TODO: define sankey chart options */
      chartOptions: FlowOptions
      scales: keyof CartesianScaleTypeRegistry
    }
  }