WPF專案中使用柱狀圖、餅狀圖、折線圖
在開發的過程中,可能會遇到柱狀圖、餅狀圖、折線圖來更好的顯示資料,最近整理了一下,遂放出來望需要的朋友可以參考。本文僅僅是簡單顯示,如需複雜顯示效果請參考官網程式碼示例。----本文程式碼使用WPF,Silverlight類似程式碼,使用第三方wpf_visifire_v5.1.2-0_trial控制元件。
後續會放上Html5示例。
程式碼下載地址:程式碼下載
先放上一組截圖吧:
公共資料:
private
List<
string
> strListx =
new
List<
string
>() {
"蘋果"
,
"櫻桃"
,
"菠蘿"
,
"香蕉"
,
"榴蓮"
,
"葡萄"
,
"桃子"
,
"獼猴桃"
};
private
List<
string
> strListy =
new
List<
string
>() {
"13"
,
"75"
,
"60"
,
"38"
,
"97"
,
"22"
,
"39"
,
"80"
};
private
List<DateTime> LsTime =
new
List<DateTime>()
{
new
DateTime(2012,1,1),
new
DateTime(2012,2,1),
new
DateTime(2012,3,1),
new
DateTime(2012,4,1),
new
DateTime(2012,5,1),
new
DateTime(2012,6,1),
new
DateTime(2012,7,1),
new
DateTime(2012,8,1),
new
DateTime(2012,9,1),
new
DateTime(2012,10,1),
new
DateTime(2012,11,1),
new
DateTime(2012,12,1),
};
private
List<
string
> cherry =
new
List<
string
>() {
"33"
,
"75"
,
"60"
,
"98"
,
"67"
,
"88"
,
"39"
,
"45"
,
"13"
,
"22"
,
"45"
,
"80"
};
private
List<
string
> pineapple =
new
List<
string
>() {
"13"
,
"34"
,
"38"
,
"12"
,
"45"
,
"76"
,
"36"
,
"80"
,
"97"
,
"22"
,
"76"
,
"39"
};
柱狀圖:
public void CreateChartColumn(string name, List<string> valuex, List<string> valuey)
{
//建立一個圖示
Chart chart = new Chart();
//設定圖示的寬度和高度
chart.Width = 580;
chart.Height = 380;
chart.Margin = new Thickness(100, 5, 10, 5);
//是否啟用列印和保持圖片
chart.ToolBarEnabled = false;
//設定圖示的屬性
chart.ScrollingEnabled = false;//是否啟用或禁用滾動
chart.View3D = true;//3D效果顯示
//建立一個標題的物件
Title title = new Title();
//設定標題的名稱
title.Text = Name;
title.Padding = new Thickness(0, 10, 5, 0);
//向圖示新增標題
chart.Titles.Add(title);
Axis yAxis = new Axis();
//設定圖示中Y軸的最小值永遠為0
yAxis.AxisMinimum = 0;
//設定圖表中Y軸的字尾
yAxis.Suffix = "斤";
chart.AxesY.Add(yAxis);
// 建立一個新的資料線。
DataSeries dataSeries = new DataSeries();
// 設定資料線的格式
dataSeries.RenderAs = RenderAs.StackedColumn;//柱狀Stacked
// 設定資料點
DataPoint dataPoint;
for (int i = 0; i < valuex.Count; i++)
{
// 建立一個數據點的例項。
dataPoint = new DataPoint();
// 設定X軸點
dataPoint.AxisXLabel = valuex[i];
//設定Y軸點
dataPoint.YValue = double.Parse(valuey[i]);
//新增一個點選事件
dataPoint.MouseLeftButtonDown += new MouseButtonEventHandler(dataPoint_MouseLeftButtonDown);
//新增資料點
dataSeries.DataPoints.Add(dataPoint);
}
// 新增資料線到資料序列。
chart.Series.Add(dataSeries);
//將生產的圖表增加到Grid,然後通過Grid新增到上層Grid.
Grid gr = new Grid();
gr.Children.Add(chart);
Simon.Children.Add(gr);
}
餅狀圖:
public void CreateChartPie(string name, List<string> valuex, List<string> valuey)
{
//建立一個圖示
Chart chart = new Chart();
//設定圖示的寬度和高度
chart.Width = 580;
chart.Height = 380;
chart.Margin = new Thickness(100, 5, 10, 5);
//是否啟用列印和保持圖片
chart.ToolBarEnabled = false;
//設定圖示的屬性
chart.ScrollingEnabled = false;//是否啟用或禁用滾動
chart.View3D = true;//3D效果顯示
//建立一個標題的物件
Title title = new Title();
//設定標題的名稱
title.Text = name;
title.Padding = new Thickness(0, 10, 5, 0);
//向圖示新增標題
chart.Titles.Add(title);
//Axis yAxis = new Axis();
////設定圖示中Y軸的最小值永遠為0
//yAxis.AxisMinimum = 0;
////設定圖表中Y軸的字尾
//yAxis.Suffix = "斤";
//chart.AxesY.Add(yAxis);
// 建立一個新的資料線。
DataSeries dataSeries = new DataSeries();
// 設定資料線的格式
dataSeries.RenderAs = RenderAs.Pie;//柱狀Stacked
// 設定資料點
DataPoint dataPoint;
for (int i = 0; i < valuex.Count; i++)
{
// 建立一個數據點的例項。
dataPoint = new DataPoint();
// 設定X軸點
dataPoint.AxisXLabel = valuex[i];
dataPoint.LegendText = "##" + valuex[i];
//設定Y軸點
dataPoint.YValue = double.Parse(valuey[i]);
//新增一個點選事件
dataPoint.MouseLeftButtonDown += new MouseButtonEventHandler(dataPoint_MouseLeftButtonDown);
//新增資料點
dataSeries.DataPoints.Add(dataPoint);
}
// 新增資料線到資料序列。
chart.Series.Add(dataSeries);
//將生產的圖表增加到Grid,然後通過Grid新增到上層Grid.
Grid gr = new Grid();
gr.Children.Add(chart);
Simon.Children.Add(gr);
}
折線圖:
public void CreateChartSpline(string name, List<DateTime> lsTime, List<string> cherry, List<string> pineapple)
{
//建立一個圖示
Chart chart = new Chart();
//設定圖示的寬度和高度
chart.Width = 580;
chart.Height = 380;
chart.Margin = new Thickness(100, 5, 10, 5);
//是否啟用列印和保持圖片
chart.ToolBarEnabled = false;
//設定圖示的屬性
chart.ScrollingEnabled = false;//是否啟用或禁用滾動
chart.View3D = true;//3D效果顯示
//建立一個標題的物件
Title title = new Title();
//設定標題的名稱
title.Text = name;
title.Padding = new Thickness(0, 10, 5, 0);
//向圖示新增標題
chart.Titles.Add(title);
//初始化一個新的Axis
Axis xaxis = new Axis();
//設定Axis的屬性
//圖表的X軸座標按什麼來分類,如時分秒
xaxis.IntervalType = IntervalTypes.Months;
//圖表的X軸座標間隔如2,3,20等,單位為xAxis.IntervalType設定的時分秒。
xaxis.Interval = 1;
//設定X軸的時間顯示格式為7-10 11:20
xaxis.ValueFormatString = "MM月";
//給圖示新增Axis
chart.AxesX.Add(xaxis);
Axis yAxis = new Axis();
//設定圖示中Y軸的最小值永遠為0
yAxis.AxisMinimum = 0;
//設定圖表中Y軸的字尾
yAxis.Suffix = "斤";
chart.AxesY.Add(yAxis);
// 建立一個新的資料線。
DataSeries dataSeries = new DataSeries();
// 設定資料線的格式。
dataSeries.LegendText = "櫻桃";
dataSeries.RenderAs = RenderAs.Spline;//折線圖
dataSeries.XValueType = ChartValueTypes.DateTime;
// 設定資料點
DataPoint dataPoint;
for (int i = 0; i < lsTime.Count; i++)
{
// 建立一個數據點的例項。
dataPoint = new DataPoint();
// 設定X軸點
dataPoint.XValue = lsTime[i];
//設定Y軸點
dataPoint.YValue = double.Parse(cherry[i]);
dataPoint.MarkerSize = 8;
//dataPoint.Tag = tableName.Split('(')[0];
//設定資料點顏色
// dataPoint.Color = new SolidColorBrush(Colors.LightGray);
dataPoint.MouseLeftButtonDown += new MouseButtonEventHandler(dataPoint_MouseLeftButtonDown);
//新增資料點
dataSeries.DataPoints.Add(dataPoint);
}
// 新增資料線到資料序列。
chart.Series.Add(dataSeries);
// 建立一個新的資料線。
DataSeries dataSeriesPineapple = new DataSeries();
// 設定資料線的格式。
dataSeriesPineapple.LegendText = "菠蘿";
dataSeriesPineapple.RenderAs = RenderAs.Spline;//折線圖
dataSeriesPineapple.XValueType = ChartValueTypes.DateTime;
// 設定資料點
DataPoint dataPoint2;
for (int i = 0; i < lsTime.Count; i++)
{
// 建立一個數據點的例項。
dataPoint2 = new DataPoint();
// 設定X軸點
dataPoint2.XValue = lsTime[i];
//設定Y軸點
dataPoint2.YValue = double.Parse(pineapple[i]);
dataPoint2.MarkerSize = 8;
//dataPoint2.Tag = tableName.Split('(')[0];
//設定資料點顏色
// dataPoint.Color = new SolidColorBrush(Colors.LightGray);
dataPoint2.MouseLeftButtonDown += new MouseButtonEventHandler(dataPoint_MouseLeftButtonDown);
//新增資料點
dataSeriesPineapple.DataPoints.Add(dataPoint2);
}
// 新增資料線到資料序列。
chart.Series.Add(dataSeriesPineapple);
//將生產的圖表增加到Grid,然後通過Grid新增到上層Grid.
Grid gr = new Grid();
gr.Children.Add(chart);
Simon.Children.Add(gr);
}
Visifire 是專為WPF、SliverLight、WP開發人員制定的一套圖表控制元件,實現了一系列的專業圖表(如:柱圖、點圖、雷達、餅圖、K線圖、以及其組合圖等)。
它在4.5版本前都是實驗階段,而且是免費的....所以贏得了大部開發人員的青睞。
然而在2011年後該公司推出的所有版本都開始收費了,這令許多開發人員忘而卻步...我也是其中之一。
如果想繼續使用免費版本,那麼就不得不對其下的兩個Dll進行反編譯...就像其它一般的破解方法一樣或者利用WPF的獨特性對其進行控制。
方法一.反編譯,找到水印的輸出入口,並遮蔽它:
步驟A: 利用Reflector、Reflexil等工具找到裝載水印的物件[WPFVisifire.Charts,]->[VisifireControl->->]
this._wMElement.Text = text;//將遮蔽
步驟B: 利用Reflector、Reflexil等工具找到裝載水印的物件[WPFVisifire.Gauges,]->[VisifireControl->->]
this._wMElement.Text = text;//將遮蔽
步驟C: 再利用Reflexil重新編譯。
方法二.程式碼控制:
找到水印的輸出物件wMElement,將其Visibity設定為Collapsed
this._waterBlock = GetChildObject<TextBlock>(this, "Watermark");
if (this._waterBlock.Tag.ToString() == "Watermark")
{
this._waterBlock.Text = string.Empty;
this._waterBlock.Visibility = System.Windows.Visibility.Collapsed;
}
方法三.樣式控制:
由於出現的水印叫Visifire Trial Edition,所以可以將系統中出現的所有該字元物件隱藏
<Application.Resources>
<Style TargetType="TextBlock">
<Setter Property="Visibility" Value="Visible" />
<Style.Triggers>
<Trigger Property="Text" Value="Visifire Trial Edition">
<Trigger.Setters>
<Setter Property="Visibility" Value="Collapsed"></Setter>
</Trigger.Setters>
</Trigger>
</Style.Triggers>
</Style>
</Application.Resources>
再發個圖:
現在更坑爹了,加了定時水印顯示,還得想辦法 了,下面轉載的第三個連結就有解決的方法
轉載自三個地方