2024年终活动

DevExpress控件使用交流,DevExpress中国社区Dev联系电话 联系电话:023-68661681

[DevExpress] ChartControl雷达图样式设置

来源:   发布时间:2017-10-09   浏览:5500次

1. 先设置主体,把背景设置成透明

ShapeStyle="Polygon"是设置雷达图的形状,Polygon指多边形,Circle指圆圈

RotationDirection="Clockwise",设置数据是否顺时针显示

2.设置AxisY

    <dxc:RadarDiagram2D.AxisY>
        <dxc:RadarAxisY2D GridLinesBrush="#FF0885FF" GridLinesMinorVisible="False" Brush="Transparent">
            <dxc:RadarAxisY2D.NumericScaleOptions>
                <dxc:ContinuousNumericScaleOptions AutoGrid="False" GridSpacing="20" GridOffset="0" ></dxc:ContinuousNumericScaleOptions>
            </dxc:RadarAxisY2D.NumericScaleOptions>
            <dxc:RadarAxisY2D.Label>
                <dxc:AxisLabel Visible="False"></dxc:AxisLabel>
            </dxc:RadarAxisY2D.Label>
            <dxc:RadarAxisY2D.WholeRange>
                <dxc:Range MinValue="0" MaxValue="100" AutoSideMargins="False"></dxc:Range>
            </dxc:RadarAxisY2D.WholeRange>
        </dxc:RadarAxisY2D>
    </dxc:RadarDiagram2D.AxisY>

GridLinesMinorVisible设置是否补充线条,

AutoGrid="False" GridSpacing="20"设置刻度间隔

dxc:AxisLabel Visible="False"这个可以设置是否显示Y刻度

Range可默认设置

3. 设置AxisX

    <dxc:RadarDiagram2D.AxisX>
        <dxc:RadarAxisX2D GridLinesVisible="True" Interlaced="False" GridLinesMinorVisible="False" GridLinesBrush="#FF0885FF">
            <dxc:RadarAxisX2D.Label>
                <dxc:AxisLabel Foreground="White"> 
                </dxc:AxisLabel>
            </dxc:RadarAxisX2D.Label>
        </dxc:RadarAxisX2D>
    </dxc:RadarDiagram2D.AxisX>

GridLinesBrush设置中间交叉线的颜色

dxc:AxisLabel设置数据标题的样式

4. 数据

    <dxc:RadarDiagram2D.Series>
        <dxc:RadarAreaSeries2D Transparency="0.7" Brush="GreenYellow">
            <dxc:RadarAreaSeries2D.MarkerModel>
                <dxc:CustomMarker2DModel>
                    <dxc:CustomMarker2DModel.PointTemplate>
                        <ControlTemplate TargetType="dxc:CustomModelControl">
                            <Ellipse Width="4" Height="4" Fill="GreenYellow"></Ellipse>
                        </ControlTemplate>
                    </dxc:CustomMarker2DModel.PointTemplate>
                </dxc:CustomMarker2DModel>
            </dxc:RadarAreaSeries2D.MarkerModel>
            <dxc:RadarAreaSeries2D.Label>
                <dxc:SeriesLabel Visible="True" ConnectorVisible="False" ElementTemplate="{StaticResource LabelItemDataTemplate}" 
                                    Indent="0" dxc:CircularSeries2D.Angle="0"></dxc:SeriesLabel>
            </dxc:RadarAreaSeries2D.Label>
            <dxc:SeriesPoint Argument="C#" Value="95" Tag="30"></dxc:SeriesPoint>
            <dxc:SeriesPoint Argument="Java" Value="20" Tag="100" />
            <dxc:SeriesPoint Argument="Python" Value="60" Tag="30" />
            <dxc:SeriesPoint Argument="Ruby" Value="80" Tag="20"/>
            <dxc:SeriesPoint Argument="VB.Net" Value="50" Tag="0"/>
            <dxc:SeriesPoint Argument="VBA" Value="90" Tag="62" />
        </dxc:RadarAreaSeries2D>
    </dxc:RadarDiagram2D.Series>

CustomMarker2DModel.PointTemplate可以重写数据点的模板

dxc:SeriesLabel Visible="True" ConnectorVisible="False" ElementTemplate="{StaticResource LabelItemDataTemplate}"  设置数据值的显示样式

效果展示:

本站文章除注明转载外,均为本站原创或翻译
欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果
转载请注明:文章转载自:DevExpress控件中文网 [https://www.devexpresscn.com/]
本文地址:https://www.devexpresscn.com/post/914.html

相关产品: DevExpress Universal Subscription,

扫码咨询
电话咨询
023-68661681
返回
顶部