CODEWITHSUNDEEP
javascriptcsschartshighcharts
user5013616
user5013616

Reputation:

put condition depending on the value HIGHCHARTS

I want that if the value is below 300, the align must be "right" and the color of the bar will be yellow.

I need to make this condition for each category. But, I do not know how to do it.

http://jsfiddle.net/pb1q9wzk/

plotOptions: {
            bar: {
                dataLabels: {
                padding:0,
                allowOverlap:true,
                    enabled: true,
                    align: 'left',
                    color: '#FFFFFF',
                    inside: true,
                    crop: false,
                    overflow:"none",
                        formatter: function() {

                    return this.series.name+ " "+ this.y;

                    console.log(this.series.name);
                },
                    style:{
                        width:100
                    }

                }
            }
        }

Upvotes: 2

Views: 464

Answers (1)

martinczerwi
martinczerwi

Reputation: 2847

I can at least solve half the problem. But couldn't figure out, how to bind the text alignment to the value.

Yellow bar if value below 300

Use the zones property inside every series:

      series: [{
          name: 'bar3',
          data: [600,540,535,500,0],
          color: "#00FF00",

          // Append this to each series:
          zones: [{
            // Make it yellow if <= 300
            color: '#f0e600',
            value: 300
          }]
        }]

Upvotes: 1

Related Questions