Gantt chart

Need help in implementing some specific function to your LightningChart Ultimate powered application? Post a question and get code snippets from other LightningChart Ultimate community members.

Gantt chart

Postby ArctionPasi » Mon Dec 26, 2016 7:03 pm

Hi developers,

Here's how to make a simple Gantt chart with LightningChart. The example was written using 7.2.3 version non-bindable WPF chart.


Code: Select all
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

using Arction.Wpf.Charting;
using Arction.Wpf.Charting.Axes;
using Arction.Wpf.Charting.SeriesXY;
using Arction.Wpf.Charting.Views;
using Arction.Wpf.Charting.Views.ViewXY;
using Arction.Wpf.Charting.Annotations;


namespace WpfApplication1
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        LightningChartUltimate _chart;
        public MainWindow()
        {
            InitializeComponent();

            CreateChart();
        }

        void CreateChart()
        {
            _chart = new LightningChartUltimate();

            _chart.BeginUpdate();
            gridMain.Children.Add(_chart);

            _chart.ChartRenderOptions.FontsQuality = FontsRenderingQuality.High;

            ViewXY v = _chart.ViewXY;
            AxisX xAxis = v.XAxes[0];
            AxisY yAxis = v.YAxes[0];

            //Set X axis properties
            xAxis.ValueType = AxisValueType.DateTime;
            xAxis.AutoFormatLabels = false;
            xAxis.LabelsTimeFormat = "MM/dd/yyyy";
            xAxis.LabelsAngle = 90;
            xAxis.SetDateOrigin(new DateTime(2000, 1, 1));//Note, do not give or show X axis values less than this
            xAxis.AutoDivSpacing = false;
            xAxis.MajorDiv = 24 * 60 * 60;//one day
            xAxis.Title.Text = "Time";


            v.ZoomPanOptions.RightToLeftZoomAction = RightToLeftZoomActionXY.ZoomOut;


            const int DeveloperCount = 5;
            //Categories: Developer 1 ... DeveloperN



            //Create custom axis ticks for Y axis
            for (int dev = 0; dev < DeveloperCount; dev++)
            {
                yAxis.CustomTicks.Add(new CustomAxisTick(xAxis,dev,"Dev "+dev.ToString(), 10, true, Colors.White, CustomTickStyle.TickAndGrid));
            }
            yAxis.CustomTicksEnabled = true;
            yAxis.AutoFormatLabels = false;



            Random rand = new Random();

            for (int dev = 0; dev < DeveloperCount; dev++)
            {
                int taskCount = rand.Next(6, 10);
                DateTime dtStart = DateTime.Now;

                for (int task = 0; task < taskCount; task++)
                {
                    if(dtStart.DayOfWeek == DayOfWeek.Saturday)
                        dtStart += TimeSpan.FromDays(2);
                    else if(dtStart.DayOfWeek == DayOfWeek.Sunday)
                        dtStart += TimeSpan.FromDays(1);

                    DateTime dtStop = dtStart + TimeSpan.FromDays((double)rand.Next(1,6));
                    string title = "Task " + task.ToString();
                    AddGanttBar(dtStart, dtStop, dev, 0.5, title,
                        DefaultColors.SeriesForBlackBackgroundWpf[task % DefaultColors.SeriesForBlackBackgroundWpf.Length]);

                    dtStart = dtStop;
                }
            }


            //Seek min and max values for X and Y axis

            double xMax = double.MinValue;
            double xMin = double.MaxValue;
            double yMax = double.MinValue;
            double yMin = double.MaxValue;

            foreach (AnnotationXY ganttBar in _chart.ViewXY.Annotations)
            {
                if (ganttBar.AxisValuesBoundaries.XMin < xMin)
                    xMin = ganttBar.AxisValuesBoundaries.XMin;
                if (ganttBar.AxisValuesBoundaries.XMax > xMax)
                    xMax = ganttBar.AxisValuesBoundaries.XMax;

                if (ganttBar.AxisValuesBoundaries.YMin < yMin)
                    yMin = ganttBar.AxisValuesBoundaries.YMin;
                if (ganttBar.AxisValuesBoundaries.YMax > yMax)
                    yMax = ganttBar.AxisValuesBoundaries.YMax;
            }

            xAxis.SetRange(xMin, xMax);
           
            yAxis.SetRange(yMin, yMax);
            yAxis.Title.Text = "Assets";

            v.LegendBox.Visible = false;

            _chart.EndUpdate();

        }


        void AddGanttBar(DateTime start, DateTime stop, double yCenter, double yHeight, string title, Color color)
        {
            //Use Annotation as Gantt bar

            ViewXY v = _chart.ViewXY;
            AxisX xAxis = v.XAxes[0];
            AxisY yAxis = v.YAxes[0];

            AnnotationXY ganttBar = new AnnotationXY(v, xAxis, yAxis);
            ganttBar.Style = AnnotationStyle.Rectangle;
            ganttBar.Sizing = AnnotationXYSizing.AxisValuesBoundaries;
            ganttBar.AxisValuesBoundaries.XMin = xAxis.DateTimeToAxisValue(start);
            ganttBar.AxisValuesBoundaries.XMax = xAxis.DateTimeToAxisValue(stop);
            ganttBar.AxisValuesBoundaries.YMin = yCenter - yHeight / 2.0;
            ganttBar.AxisValuesBoundaries.YMax = yCenter + yHeight / 2.0;
            ganttBar.Fill.GradientFill = GradientFill.Solid;
            ganttBar.Fill.Color = Color.FromArgb(200, color.R, color.G, color.B);
            ganttBar.Text = title;
            ganttBar.Shadow.Visible = false;
            ganttBar.RotateByMouse = false;
            ganttBar.AnchorAdjustByMouse = false;
            ganttBar.ResizeByMouse = false;
            ganttBar.MoveByMouse = false;
            ganttBar.TargetMoveByMouse = false;

            v.Annotations.Add(ganttBar);
        }
    }
}



Gantt-chart.jpg
Gantt chart
Gantt-chart.jpg (228.67 KiB) Viewed 2347 times


The example uses Annotations. There's another ways to make Gantt chart as well, such as:
  • PolygonSeries, each bar composes of 4 corners. Text on each bar, like in annotation.
  • LineCollections, simplified output when lots of bars to show. No text on each bar.
LightningChart Support Team, PT
User avatar
ArctionPasi
 
Posts: 1362
Joined: Tue Mar 26, 2013 10:57 pm
Location: Finland

Return to LightningChart Ultimate How-To's

Who is online

Users browsing this forum: No registered users and 1 guest

cron