Custom Rendering Chart for WinForms C# Tutorial

• WinForms Chart Control
• Chart Series Types
• Axes in Chart for WinForms
• Features of Chart Control
• Chart Data Binding
• Custom Color Palettes of Chart

How to Customize Rendering for Line Series

• The values of price are defined to the categorical data points and will fall in the range of 0 to 100 dollars.
• The color of the line will change as the below setting when it reaches the certain prices value. a, 10 dollars - gray; b, 30 dollars - blue; c, 50 dollars - yellow; d, 80 dollars - red.

1. Developers need to create a Form in their project and add the Chart control to the Form.
2. Create a LineSeries instance and add the categorical data points in the form’s Load event handler. The above sample will generate random values of prices in the range of 0 - 100.
3. Add the series to the WinFormsChart.Series collection, set appropriate values to the LabelFormat and LabelFitMode of the HorizontalAxis and VerticalAxis properties.
4. Subscribe to the CreateRenderer of the Chart control and instantiate the Renderer property of the event arguments to a new CustomCartesianRederer instance.
5. The CreateRenderer event allows users to plug any custom implementation of chart renderer.
6. Now create a CustomCartesianRenderer class that inherits CartesianRenderer and overrides the Initialize method.
7. After calling the base method, the DrawParts collection contains objects to draw axes, labels, series etc.
8. Now we can customize the CustomLineSeriesDrawPart implementation.
9. Override the DrawLine method and use the GraphicsPath provided by the GetLinePath method.
10. Use a LinearGradientBrush and use its ColorBlend to set appropriate positions and colors to draw a path with gradient colors
11. Create a class that will store Color Position couples before getting the CustomLineSeriesDrawPart class
12. Go back to the CustomLineSeriesDrawPart, and create a method which calculates the positions and colors that need to be assigned to the ColorBlend of the brush.
13. Calculate the color of the points that fall between two predefined values.
14. Make sure that the line segments between each two consecutive points are colored properly
15. After finishing above steps, developers can get a customized rendering of data points