WPF实现雷达图(仿英雄联盟)

最新推荐文章于 2022-07-04 16:46:46 发布

原创

最新推荐文章于 2022-07-04 16:46:46 发布 · 469 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#wpf #microsoft

本文介绍了如何在WPF中实现雷达图，由于WPF没有内置的雷达图控件，作者通过创建自定义Control `RadarChart.cs`来实现这一功能。详细步骤包括：设置数据集合，重写OnRender方法，使用三角函数和圆的半径计算绘制多边形的点，并根据需求调整多边形大小。示例代码包括`RadarChartExample.xaml`和`RadarChartExample.xaml.cs`，最终效果展示了英雄联盟用户数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

有小伙伴提出需要实现雷达图。

由于在WPF中没有现成的雷达图控件，所以我们自己实现一个。

PS：有更好的方式欢迎推荐。

代码如下

一、创建 RadarChart.cs 菜单继承 Control代码如下。

RadarChart.cs实现思路如下

1、RadarArray ：存放展示集合。

2、重写OnRender 。

3、根据三角函数和圆的半径计算出圆上的N个点绘制成多边形

GetPolygonPoint()。

4、在绘制多边形的时候因为需要多个大小不一的多边形，则需要

多次调用GetPolygonPoint()方法，最外层绘制150，中间层100

中心点层 50。

5、DrawPoints() 方法增加了一个bool参数isDrawText是否绘制Text文

本，因为最外侧需要绘制文本。

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Globalization;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Shapes;

namespace WPFDevelopers.Controls
{
    public class RadarChart:Control
    {
        public ObservableCollection<RadarModel> RadarArray
        {
            get { return (ObservableCollection<RadarModel>)GetValue(RadarArrayProperty); }
            set { SetValue(RadarArrayProperty, value); }
        }

        public static readonly DependencyProperty RadarArrayProperty =
            DependencyProperty.Register("RadarArray", typeof(ObservableCollection<RadarModel>), typeof(RadarChart), new PropertyMetadata(null));


        static RadarChart()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(RadarChart), new FrameworkPropertyMetadata(typeof(RadarChart)));
        }
        protected override void OnRender(DrawingContext drawingContext)
        {
            DrawPoints(150, drawingContext,true);
            DrawPoints(100, drawingContext);
            DrawPoints(50, drawingContext);

            var myPen = new Pen
            {
                Thickness = 4,
                Brush = Brushes.DodgerBlue
            };
            myPen.Freeze();
            StreamGeometry streamGeometry = new StreamGeometry();
            using (StreamGeometryContext geometryCont