diff --git a/src/chart/sankey/SankeySeries.ts b/src/chart/sankey/SankeySeries.ts index 2ef1e77795..bc07d45004 100644 --- a/src/chart/sankey/SankeySeries.ts +++ b/src/chart/sankey/SankeySeries.ts @@ -85,6 +85,7 @@ export interface SankeyEdgeItemOption extends StatesOptionMixin, GraphEdgeItemObject { focusNodeAdjacency?: FocusNodeAdjacency + edgeLabel?: SeriesLabelOption } export interface SankeyLevelOption extends SankeyNodeStateOption, SankeyEdgeStateOption { @@ -137,6 +138,10 @@ export interface SankeySeriesOption links?: SankeyEdgeItemOption[] levels?: SankeyLevelOption[] + + edgeLabel?: SeriesLabelOption & { + position?: 'inside' + } } class SankeySeriesModel extends SeriesModel { @@ -298,6 +303,11 @@ class SankeySeriesModel extends SeriesModel { fontSize: 12 }, + edgeLabel: { + show: false, + fontSize: 12 + }, + levels: [], nodeAlign: 'justify', diff --git a/src/chart/sankey/SankeyView.ts b/src/chart/sankey/SankeyView.ts index 5a9110f760..5432908d48 100644 --- a/src/chart/sankey/SankeyView.ts +++ b/src/chart/sankey/SankeyView.ts @@ -220,6 +220,16 @@ class SankeyView extends ChartView { } } + setLabelStyle( + curve, getLabelStatesModels(edgeModel, 'edgeLabel'), + { + labelFetcher: seriesModel, + labelDataIndex: edge.dataIndex, + defaultText: `${edgeModel.get('value')}` + } + ); + curve.setTextConfig({ position: 'inside' }); + const emphasisModel = edgeModel.getModel('emphasis'); setStatesStylesFromModel(curve, edgeModel, 'lineStyle', (model) => model.getItemStyle()); diff --git a/src/chart/sankey/sankeyVisual.ts b/src/chart/sankey/sankeyVisual.ts index 9425a615a9..a0f4add053 100644 --- a/src/chart/sankey/sankeyVisual.ts +++ b/src/chart/sankey/sankeyVisual.ts @@ -20,12 +20,13 @@ import * as zrUtil from 'zrender/src/core/util'; import VisualMapping from '../../visual/VisualMapping'; import GlobalModel from '../../model/Global'; -import SankeySeriesModel, { SankeyNodeItemOption } from './SankeySeries'; +import SankeySeriesModel, { SankeyEdgeItemOption, SankeyNodeItemOption } from './SankeySeries'; export default function sankeyVisual(ecModel: GlobalModel) { ecModel.eachSeriesByType('sankey', function (seriesModel: SankeySeriesModel) { const graph = seriesModel.getGraph(); const nodes = graph.nodes; + const edges = graph.edges; if (nodes.length) { let minValue = Infinity; let maxValue = -Infinity; @@ -59,5 +60,11 @@ export default function sankeyVisual(ecModel: GlobalModel) { } }); } + if (edges.length) { + zrUtil.each(edges, function (edge) { + const edgeStyle = edge.getModel().get('lineStyle'); + edge.setVisual('style', edgeStyle); + }); + } }); } \ No newline at end of file diff --git a/test/sankey-depth.html b/test/sankey-depth.html index cf34ca6fd6..89a4d2d156 100644 --- a/test/sankey-depth.html +++ b/test/sankey-depth.html @@ -128,6 +128,11 @@ label: { position: 'left' }, + edgeLabel: { + show: true, + color: 'green', + fontSize: 20 + }, // Used to test when the data is null whether it is work well. // data: [], // links: [],