Home Forums Feature Requests & Feedback Candlestick colours

Candlestick colours

Viewing 3 posts - 1 through 3 (of 3 total)
  • #19398


    First of all congratulation on your brilliant product, it is by far the best I have come across, and to top it, the support, examples, responses are amazing.

    I have a question regarding the candlestick chart. How can I set the border color to whatever the risingcolor or fallingcolor is?
    I.e I want my rising candlesticks to be entirely green, and falling candlesticks to be entirely red.
    Currently, the green rising bars have a red border.



    You can set dataPoint color based on the the dataPoint value, whether its rising or falling. Please check this jsfiddle for an example.

    function changeBorderColor(chart){
      var dataSeries;
      for( var i = 0; i < chart.options.data.length; i++){
        dataSeries = chart.options.data[i];
        for(var j = 0; j < dataSeries.dataPoints.length; j++){
          dataSeries.dataPoints[j].color = (dataSeries.dataPoints[j].y[0] <= dataSeries.dataPoints[j].y[3]) ? (dataSeries.risingColor ? dataSeries.risingColor : dataSeries.color) : (dataSeries.fallingColor ? dataSeries.fallingColor : dataSeries.color);

    customizing candle stick color

    Vishwas R
    Team CanvasJS


    Wow what a difference this has made to the readability of the graph.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.