針對桌面新的數據可視化方式——桑基圖，你瞭解多少？

點擊獲取工具>>

針對那些但願以新穎獨特的方式可視化數據的用戶來講，新版本對數據可視化進行了重大升級，v20.1包含一個新的Sankey Diagram控件（用於WinForms和WPF）。

Sankey Diagrams顯示節點和關聯數據之間的路徑，每一個路徑的粗細根據相應節點的值而變化。使用時，最終用戶能夠輕鬆地看到主要路徑，並發現給定流程中的低效率或損失。這些圖一般用於顯示資源流（銷售，預算）以及信息或能源使用狀況。

自定義Colorizer

要基於自定義算法繪製連接和節點，請建立一個實現ISankeyColorizer接口的類。 而後，將此類的對象分配給Colorizer屬性。

如下代碼實現了一個 colorizer，該 colorizer將隨機顏色應用於節點，並指定用於將漸變填充應用於連接的顏色：

C#

`private void Form1_Load(object sender, EventArgs e) {
sankeyDiagramControl1.Colorizer = new MyColorizer {
LinkSourceColor = Color.Red,
LinkTargetColor = Color.Yellow
};

public class MyColorizer : ISankeyColorizer {
public event EventHandler ColorizerChanged;
Random rand = new Random();
Dictionary<string, Color> KeyColorPairs = new Dictionary<string, Color>();
public Color LinkSourceColor { get; set; }
public Color LinkTargetColor { get; set; }
public Color GetLinkSourceColor(SankeyLink link) {
return LinkSourceColor;
}
public Color GetLinkTargetColor(SankeyLink link) {
return LinkTargetColor;
}
public Color GetNodeColor(SankeyNode info) {
if (!KeyColorPairs.TryGetValue((string)info.Tag, out Color nodeColor)) {
nodeColor = GenerateColor();
KeyColorPairs.Add((string)info.Tag, nodeColor);
}
return nodeColor;
}
private Color GenerateColor() {
return Color.FromArgb(rand.Next(256), rand.Next(256), rand.Next(256));
}
}
`
VB.NET

`Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs)
sankeyDiagramControl1.Colorizer = New MyColorizer With {
.LinkSourceColor = Color.Red,
.LinkTargetColor = Color.Yellow
}
End Sub

Public Class MyColorizer
Inherits ISankeyColorizer

Public Event ColorizerChanged As EventHandler
Private rand As Random = New Random()
Private KeyColorPairs As Dictionary(Of String, Color) = New Dictionary(Of String, Color)()
Public Property LinkSourceColor As Color
Public Property LinkTargetColor As Color

Public Function GetLinkSourceColor(ByVal link As SankeyLink) As Color
Return LinkSourceColor
End Function

Public Function GetLinkTargetColor(ByVal link As SankeyLink) As Color
Return LinkTargetColor
End Function

Public Function GetNodeColor(ByVal info As SankeyNode) As Color
Dim nodeColor As Color = Nothing

If Not KeyColorPairs.TryGetValue(CStr(info.Tag), nodeColor) Then
nodeColor = GenerateColor()
KeyColorPairs.Add(CStr(info.Tag), nodeColor)
End If

Return nodeColor
End Function

Private Function GenerateColor() As Color
Return Color.FromArgb(rand.Next(256), rand.Next(256), rand.Next(256))
End Function
End Class
`

自定義工具提示

當鼠標指針懸停在節點或連接上時，將顯示工具提示。 使用 SankeyToolTipOptions.NodeToolTipEnabled、SankeyToolTipOptions.LinkToolTipEnabled和ToolTipController 屬性能夠禁用/啓用工具提示並自定義其外觀。 要格式化工具提示文本，請處理CustomizeNodeToolTip和CustomizeLinkToolTip事件，並在事件處理程序中指定CustomizeSankeyToolTipEventArgs.Title和CustomizeSankeyToolTipEventArgs.Content屬性。

如下代碼格式化了工具提示中使用的文本，e.Node.Tag、e.Link.Source.Tag和e.Link.Target.Tag屬性存儲在默認工具提示標題中顯示的值。 要獲取節點和連接權重，請使用e.Node.TotalWeight和e.Link.TotalWeight屬性。

C#

`private void Form1_Load(object sender, EventArgs e) {
sankeyDiagramControl1.ToolTipOptions.LinkToolTipEnabled = DevExpress.Utils.DefaultBoolean.True;
sankeyDiagramControl1.ToolTipOptions.NodeToolTipEnabled = DevExpress.Utils.DefaultBoolean.True;
sankeyDiagramControl1.ToolTipController = new DevExpress.Utils.ToolTipController {
ToolTipType = DevExpress.Utils.ToolTipType.Flyout,
AllowHtmlText = true
};
sankeyDiagramControl1.CustomizeNodeToolTip += OnCustomizeNodeToolTip;
sankeyDiagramControl1.CustomizeLinkToolTip += OnCustomizeLinkToolTip;
}
private void OnCustomizeNodeToolTip(object sender, CustomizeSankeyNodeToolTipEventArgs e) {
e.Title = $"Country: <u>{e.Node.Tag}</u>";
e.Content = $"{e.Node.TotalWeight:f1}";
}

private void OnCustomizeLinkToolTip(object sender, CustomizeSankeyLinkToolTipEventArgs e) {
e.Title = $"{e.Link.Source.Tag} → {e.Link.Target.Tag}";
e.Content = $"{e.Link.TotalWeight}";
}
`
VB.NET

`Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs)
sankeyDiagramControl1.ToolTipOptions.LinkToolTipEnabled = DevExpress.Utils.DefaultBoolean.[True]
sankeyDiagramControl1.ToolTipOptions.NodeToolTipEnabled = DevExpress.Utils.DefaultBoolean.[True]
sankeyDiagramControl1.ToolTipController = New DevExpress.Utils.ToolTipController With {
.ToolTipType = DevExpress.Utils.ToolTipType.Flyout,
.AllowHtmlText = True
}
sankeyDiagramControl1.CustomizeNodeToolTip += AddressOf OnCustomizeNodeToolTip
sankeyDiagramControl1.CustomizeLinkToolTip += AddressOf OnCustomizeLinkToolTip
End Sub

Private Sub OnCustomizeNodeToolTip(ByVal sender As Object, ByVal e As CustomizeSankeyNodeToolTipEventArgs)
e.Title = $"Country: <u>{e.Node.Tag}</u>"
e.Text = $"{e.Node.TotalWeight:f1}"
End Sub

Private Sub OnCustomizeLinkToolTip(ByVal sender As Object, ByVal e As CustomizeSankeyLinkToolTipEventArgs)
e.Title = $"{e.Link.Source.Tag} → {e.Link.Target.Tag}"
e.Text = $"{e.Link.TotalWeight}";
End Sub
`

打印和導出

要打印控件，請選擇使用如下方法：

• Print
• ShowPrintDialog
• ShowPrintPreview
• ShowRibbonPrintPreview

使用如下方法能夠將控件導出爲各類格式：

• ExportToDocx
• ExportToHtml
• ExportToImage
• ExportToMht
• ExportToPdf
• ExportToRtf
• ExportToSvg
• ExportToXls

下面的代碼將生成的Sankey圖圖像的寬度設置爲文檔寬度，並將Sankey圖導出爲PDF文件：

C#

`sankeyDiagramControl1.OptionsPrint.SizeMode = DevExpress.XtraCharts.Printing.PrintSizeMode.Zoom;
sankeyDiagramControl1.ExportToPdf("D://sankey.pdf");
`
VB.NET

`sankeyDiagramControl1.OptionsPrint.SizeMode = DevExpress.XtraCharts.Printing.PrintSizeMode.ZoomsankeyDiagramControl1.ExportToPdf("D://sankey.pdf")`