How to draw a short line on a Candle chart

[Louis S. Berman]

Hi!

I'd like to draw one of two different short lines on a Candle series:

• A horizontal line, extending from a start candle to an end candle, and anchored to the start candle's high or low 
• A sloped line, extending from the high or low of a starting candle and extending to the high or low of an ending candle

I'd also like to style the candle (width, color, dotted vs. solid, etc.) 

Any help in this regard would be greatly appreciated...

[Durga Gopalakrishnan]

Hi Louis, 

Greetings from Syncfusion. 

We have analysed your queries. The horizontal line from start candle to end candle can be drawn using line series. The candle series can be customized using color, width and dasharray properties in series. We have prepared sample for your reference. Please check with code snippet and screenshot. 

Code Snippet 

<EjsChart> 

    <ChartSeriesCollection> 

        <ChartSeries Width="5" DashArray="4,5" DataSource="@chartData" XName="x" High="high" Low="low"  Open="open" Close="close" BearFillColor="yellow" BullFillColor="orange" Type="ChartSeriesType.Candle"> 

        </ChartSeries> 

        <ChartSeries Width="1" DataSource="@chartData1" XName="x" YName="y" Type="ChartSeriesType.Line"> 

        </ChartSeries> 

        <ChartSeries Width="1" DataSource="@chartData2" XName="x" YName="y" Type="ChartSeriesType.Line"> 

        </ChartSeries> 

    </ChartSeriesCollection> 

</EjsChart> 

Screenshot 

 

Sample 

https://www.syncfusion.com/downloads/support/directtrac/general/ze/Candle-377516257.zip 

Kindly revert us, if you have any concerns. 

Regards, 

Durga G

[Louis S. Berman]

Thanks for the sample.  Unfortunately, your sample goes the full width of the chart.  I want to draw lines that span the width of a few bars.  Is there any way to do this?

[Durga Gopalakrishnan]

Hi Louis, 

We have analysed your query. To draw the lines that span the width of a few bars, specify the start and end date based on your need. We have modified sample and attached for your reference. Please check with the below code snippet and sample. 

Code Snippet 

 

@code { 

    public List<LineChartData> chartData1 = new List<LineChartData> 

    { 

        new LineChartData { x = new DateTime(1950, 1, 12), y = 70}, 

        new LineChartData { x = new DateTime(1971, 1, 12), y = 60}, 

    }; 

    public List<LineChartData> chartData2 = new List<LineChartData> 

    { 

        new LineChartData { x = new DateTime(1950, 1, 12), y = 125}, 

        new LineChartData { x = new DateTime(1991, 1, 12), y = 125}, 

    }; 

} 

Screenshot 

 

Sample 

https://www.syncfusion.com/downloads/support/directtrac/general/ze/CandleStick-1960481450.zip 

Kindly revert us, if you have any concerns. 

Regards, 

Durga G