Gauge Chart - Custom Ticks

Hello Guys,

i am creating various Charts with vaadin atm, and i have found a feature that is supported by highcharts but not (or i didn´t find it) by Vaadin.

Highcharts supports custom ticks for gauge charts, example here:

You see there are 2 custom ticks (90,80) wich would be exactly what i need to make a traffic light like gauge chart that shows the user the thresholds aswell.

Did i just not find the feature or isn´t it implemented? Or how could i still achive this behaviour?

Thank you!


edit: I am Using vaadin 7.3.9 and Charts 2.0.0

Hi Michael,

Unfortunately there are some configuration settings that we haven’t gotten around to implementing yet. However, the good news is that it is fairly easy to extend the behavior. In this case you could just do something like the following:

import com.vaadin.addon.charts.model.YAxis;

public class GaugeYAxis extends YAxis {
private Double tickPositions;

public void setTickPositions(Double... tickPositions) {
    this.tickPositions = tickPositions;

public Double[] getTickPositions() {
    return tickPositions;

[/code]And then you can use your GaugeYAxis instead of a normal YAxis in your configuration and everything should be serialized into JSON automatically.


Thank you Jonatan! This is just great = )