DevExpress Silverlight DXChart特效总结_app

概述1、主题修改引用 xmlns:core=http://schemas.devexpress.com/winfx/2008/xaml/core 在Grid中添加core:ThemeManager.ApplicationTheme ="DXStyle" 主页引用一次即可 2、坐标倒影 <dxc:ChartControl Name="chartControl1" > <dxc:Cha

1、主题修改

引用 xmlns:core=http://schemas.devexpress.com/winfx/2008/xaml/core

在GrID中添加core:themeManager.Applicationtheme ="DXStyle"

主页引用一次即可

2、坐标倒影

<dxc:ChartControl name="chartControl1" >

<dxc:ChartControl.Diagram>

<dxc:XYDiagram2D>

<dxc:XYDiagram2D.DefaultPane>

<dxc:Pane MirrorHeight="100" />

</dxc:XYDiagram2D.DefaultPane>

<dxc:XYDiagram2D.SerIEs>

</dxc:XYDiagram2D.SerIEs>

</dxc:XYDiagram2D>

</dxc:ChartControl.Diagram>

<dxc:ChartControl.Legend>

<dxc:Legend />

</dxc:ChartControl.Legend>

</dxc:ChartControl>

3、动态加载效果

<dxc:ChartControl name="chartControl1"  EnableAnimation="True" >

EnableAnimation：激活动画，True 或者 False。True是激活；False是不激活。

4、透明度

<dxc:BubbleSerIEs2D displayname="Second SerIEs" Transparency="0.1">

Transparency：透明度，范围0~1。0：不透明；1是完全透明。并非所有类型都支持透明

5、饼图空心特效

<dxc:PIESerIEs2D <!—空心大小，0为实心--> HoleRadiusPercent="20">

6、饼图点击某区域实现分离动态特效滚动特效

在后台代码添加

const int clickDelta = 200;

DateTime mouseDownTime;

bool rotate;

Point startposition;

bool IsClick(DateTime mouseUpTime)

{

return (mouseUpTime - mouseDownTime).TotalMilliseconds < clickDelta;

}

double CalcAngle(Point p1,Point p2)

{

Point center = new Point(chartControl1.Diagram.ActualWIDth / 2,chartControl1.ActualHeight / 2);

Point relativeP1 = new Point(p1.X - center.X,p1.Y - center.Y);

Point relativeP2 = new Point(p2.X - center.X,p2.Y - center.Y);

double angleP1Radian = Math.atan2(relativeP1.X,relativeP1.Y);

double angleP2Radian = Math.atan2(relativeP2.X,relativeP2.Y);

double angle = (angleP2Radian - angleP1Radian) * 180 / (Math.PI * 2);

if (angle > 90)

angle = 180 - angle;

else if (angle < -90)

angle = 180 + angle;

return angle;

}

voID chart_MouseUp(object sender,MousebuttonEventArgs e)

{

ChartHitInfo hitInfo = chartControl1.CalcHitInfo(e.Getposition(chartControl1));

rotate = false;

if (hitInfo == null || hitInfo.SerIEsPoint == null || !IsClick(DateTime.Now))

return;

double distance = PIESerIEs.GetExplodeddistance(hitInfo.SerIEsPoint);

Storyboard storyBoard = new Storyboard();

DoubleAnimation animation = new DoubleAnimation();

animation.Duration = new Duration(new TimeSpan(0,300));

animation.To = distance > 0 ? 0 : 0.3;

storyBoard.Children.Add(animation);

Storyboard.SetTarget(animation,hitInfo.SerIEsPoint);

Storyboard.SetTargetProperty(animation,new PropertyPath(PIESerIEs.ExplodeddistanceProperty));

storyBoard.Begin();

}

voID chart_MouseDown(object sender,MousebuttonEventArgs e)

{

mouseDownTime = DateTime.Now;

Point position = e.Getposition(chartControl1);

ChartHitInfo hitInfo = chartControl1.CalcHitInfo(position);

if (hitInfo != null && hitInfo.SerIEsPoint != null)

{

rotate = true;

startposition = position;

}

voID chart_MouseMove(object sender,MouseEventArgs e)

{

Point position = e.Getposition(chartControl1);

ChartHitInfo hitInfo = chartControl1.CalcHitInfo(position);

if (hitInfo == null)

return;

if (rotate && !IsClick(DateTime.Now))

{

PIESerIEs2D serIEs = chartControl1.Diagram.SerIEs[0] as PIESerIEs2D;

double angleDelta = CalcAngle(startposition,position);

startposition = position;

}

voID ChartsDemoModule_ModuleAppear(object sender,RoutedEventArgs e)

{

chartControl1.Animate();

}

voID rblSweepDirection_SelectedindexChanged(object sender,RoutedEventArgs e)

{

if (chartControl1 != null)

chartControl1.Animate();

}

voID chart_queryChartCursor(object sender,queryChartCursorEventArgs e)

{

ChartHitInfo hitInfo = chartControl1.CalcHitInfo(e.position);

if (hitInfo != null && hitInfo.SerIEsPoint != null)

e.Cursor = Cursors.Hand;

}

在前台添加

<dxc:ChartControl name="chartControl1" MouseleftbuttonUp="chart_MouseUp" MouseleftbuttonDown="chart_MouseDown" <!—边框厚度，0是没有-->borderThickness="0" MouseMove="chart_MouseMove" queryChartCursor="chart_queryChartCursor">

7、颜色区分(并非所有有效)

<dxc:PointSerIEs2D <!—是否区分颜色。True是区分；False是不区分-->colorEach="True" <!—点的大小-->MarkerSize="20">

8、参数标签

<dxc:ChartControl.CrosshairOptions>

<dxc:CrosshairOptions

<!—X轴坐标值标签-->ShowArgumentLabels="True"

<!—X轴横坐标值基准线-->ShowArgumentline="True"

<!—Y轴纵坐标值标签-->ShowValueLabels="True"

<!—Y轴横坐标值基准线-->ShowValueline="True" />

</dxc:ChartControl.CrosshairOptions>

9、是否显示点标签

<dxc:AreaStackedSerIEs2D displayname="First SerIEs" <!—点标签。True为显示；False为不显示-->LabelsVisibility="True">