WPF界面開發(fā)工具DevExpress WPF使用教程：創(chuàng)建簡(jiǎn)單的未綁定3D圖表（第一部分）

---

下載DevExpress v20.1完整版    DevExpress v20.1漢化資源獲取

通過(guò)DevExpress WPF Controls，您能創(chuàng)建有著強(qiáng)大互動(dòng)功能的XAML基礎(chǔ)應(yīng)用程序，這些應(yīng)用程序?qū)Ｗ⒂诋?dāng)代客戶的需求和構(gòu)建未來(lái)新一代支持觸摸的解決方案。

在本教程中，您將學(xué)習(xí)如何設(shè)計(jì)一個(gè)簡(jiǎn)單的3D圖表，如何用數(shù)據(jù)填充它，以及配置常見的圖表設(shè)置。

 執(zhí)行以下步驟來(lái)創(chuàng)建帶有3D圖表的應(yīng)用程序，本文我們將為大家介紹Step 1、Step 2，更多完整內(nèi)容歡迎持續(xù)關(guān)注！

• Step 1. 創(chuàng)建一個(gè)新項(xiàng)目并添加圖表
• Step 2. 用數(shù)據(jù)填充圖表
• Step 3. 自定義圖表
• 結(jié)果

Step 1. 創(chuàng)建一個(gè)新項(xiàng)目并添加圖表

 1. 運(yùn)行Microsoft Visual Studio 2012, 2013, 2015, 2017或2019。

2. 創(chuàng)建一個(gè)新的WPF Application項(xiàng)目。

3. 將Chart3DControl添加到您的項(xiàng)目，您可以通過(guò)將組件從DX.20.1: Data & Analytics標(biāo)簽拖動(dòng)到主窗口來(lái)完成此操作。

 4. 右鍵單擊Chart3D控件，然后在上下文菜單中選擇Layout | Reset All，這將拉伸圖表來(lái)填充整個(gè)窗口。

5. 執(zhí)行完這些操作后，XAML標(biāo)記應(yīng)如下所示。 如果不是，請(qǐng)使用下面的標(biāo)記覆蓋您的標(biāo)記。

<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Chart3D_Lesson1"
xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/charts" 
x:Class="Chart3D_Lesson1.MainWindow"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<dxc:Chart3DControl>
<dxc:Chart3DControl.Legends>
<dxc:Legend BorderBrush="Transparent" 
Background="Transparent"/>
</dxc:Chart3DControl.Legends>
<dxc:Series3DStorage>
<dxc:Series3D DisplayName="Series 1">
<dxc:Series3D.View>
<dxc:SurfaceSeriesView>
<dxc:SurfaceSeriesView.FillStyle>
<dxc:GradientFillStyle/>
</dxc:SurfaceSeriesView.FillStyle>
</dxc:SurfaceSeriesView>
</dxc:Series3D.View>
<dxc:SeriesPoint3DStorage>
<dxc:SeriesPoint3D Value="0" XArgument="0" YArgument="0"/>
<dxc:SeriesPoint3D Value="0" XArgument="0" YArgument="1"/>
<dxc:SeriesPoint3D Value="1" XArgument="1" YArgument="0"/>
<dxc:SeriesPoint3D Value="1" XArgument="1" YArgument="1"/>
<dxc:SeriesPoint3D Value="0" XArgument="2" YArgument="0"/>
<dxc:SeriesPoint3D Value="0" XArgument="2" YArgument="1"/>
<dxc:SeriesPoint3D Value="1" XArgument="3" YArgument="0"/>
<dxc:SeriesPoint3D Value="1" XArgument="3" YArgument="1"/>
</dxc:SeriesPoint3DStorage>
</dxc:Series3D>
</dxc:Series3DStorage>
</dxc:Chart3DControl>
</Grid>
</Window>

Step 2. 用數(shù)據(jù)填充圖表

在此步驟中，您將手動(dòng)向3D圖表添加序列，并用點(diǎn)手動(dòng)填充該序列。

 1. 默認(rèn)情況下，3D圖表系列源設(shè)置為，該存儲(chǔ)的 集合保留所有手動(dòng)添加的系列。要調(diào)用集合編輯器，請(qǐng)單擊屬性中的省略號(hào)按鈕。

2. 從集合中刪除默認(rèn)系列。

3. 然后，通過(guò)單擊Add按鈕添加系列。

4. 要使用點(diǎn)手動(dòng)填充系列，請(qǐng)將對(duì)象分配給屬性。

5. 展開PointSource屬性組，然后單擊屬性的省略號(hào)按鈕來(lái)調(diào)用序列點(diǎn)編輯器。

6. 單擊Add按鈕將點(diǎn)添加到點(diǎn)集合。

7. 接下來(lái)，您需要定義點(diǎn)、和屬性，如下圖所示。

8. 重復(fù)前面的兩個(gè)操作以添加其他點(diǎn)，使用下表數(shù)據(jù)定義點(diǎn)參數(shù)。

注意：如有必要，您可以在本節(jié)末尾復(fù)制代碼實(shí)現(xiàn)點(diǎn)。

 9. 單擊OK離開SeriesPoint3D Collection編輯器，再次單擊OK來(lái)離開Series3D Collection編輯器。

這些操作完成后，您將獲得以下XAML。

<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Chart3D_Lesson1"
xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/charts" 
x:Class="Chart3D_Lesson1.MainWindow"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<dxc:Chart3DControl>
<dxc:Chart3DControl.Legends>
<dxc:Legend BorderBrush="Transparent" Background="Transparent"/>
</dxc:Chart3DControl.Legends>
<dxc:Series3DStorage>
<dxc:Series3D>
<dxc:SeriesPoint3DStorage>
<dxc:SeriesPoint3D Value="130.32" XArgument="Canada" YArgument="Fossil"/>
<dxc:SeriesPoint3D Value="597.24" XArgument="Russia" YArgument="Fossil"/>
<dxc:SeriesPoint3D Value="333.45" XArgument="Germany" YArgument="Fossil"/>
<dxc:SeriesPoint3D Value="232.49" XArgument="UK" YArgument="Fossil"/>
<dxc:SeriesPoint3D Value="125.28" XArgument="Spain" YArgument="Fossil"/>
<dxc:SeriesPoint3D Value="320.37" XArgument="Canada" YArgument="Renewable"/>
<dxc:SeriesPoint3D Value="199.08" XArgument="Russia" YArgument="Renewable"/>
<dxc:SeriesPoint3D Value="146.25" XArgument="Germany" YArgument="Renewable"/>
<dxc:SeriesPoint3D Value="41.64" XArgument="UK" YArgument="Renewable"/>
<dxc:SeriesPoint3D Value="80.91" XArgument="Spain" YArgument="Renewable"/>
<dxc:SeriesPoint3D Value="81.45" XArgument="Canada" YArgument="Nuclear"/>
<dxc:SeriesPoint3D Value="151.68" XArgument="Russia" YArgument="Nuclear"/>
<dxc:SeriesPoint3D Value="87.75" XArgument="Germany" YArgument="Nuclear"/>
<dxc:SeriesPoint3D Value="65.93" XArgument="UK" YArgument="Nuclear"/>
<dxc:SeriesPoint3D Value="54.81" XArgument="Spain" YArgument="Nuclear"/>
</dxc:SeriesPoint3DStorage>
</dxc:Series3D>
</dxc:Series3DStorage>
</dxc:Chart3DControl>
</Grid>
</Window>

---

DevExpress技術(shù)交流群2：775869749      歡迎一起進(jìn)群討論

富文本控件難上手？這堂公開課你一定不能錯(cuò)過(guò)，不同視圖不同應(yīng)用場(chǎng)景全解！