Vaadin Charts - Getting to the Gauge's Pivot property?

Flow
1

Hi, I am palying with Vaadin Charts trying to get to rid of the Gauge’s pivot (or change its color).

I can now change the color of the needle, but it does not look right with the default pivot.

Using the Highchart jsfiddle I can achieve the look I am after… eg.
gauge: {
pivot: {
radius: 0
},
dial: {
radius: 75, …etc
},
overshoot: 5
}

Is there a way I can manipulate parts of the Highchart structure that have not been ported over to Vaadin Charts yet?

Note that I also want access to the overshoot property which I can’t find in Vaadin Charts either.

I have had a look at chart.drawChart(json), but have not been able to get that working.

Thanks for any help…

2

Managed to get the setting of json working…

The problem was I copied out of jsfidle and my copy included comments, eg
... part of the json string sent to high charts String json = "{" + "chart: { " ... other stuff... + " plotBands: [{ " + " from: 0, " + " to: 6.9, " + " color: '#99DD66' // green " + " }, { " ... etc Having the javascript comment in the json string (as copied from jsfiddle) does not work… took a bit to find it, but now I can get the look I want via setting pure json… (still will be good to get the other properties in the java interface at some time).

Thanks

3

Hi, you are right, there’s some missing API for pivot and overshoot configuration. You can create a ticket in
https://dev.vaadin.com/
 about it.

In the meantime as a workaround you can extend a class and add the missing API, for instance:

public class PlotOptionsGaugeWithOvershoot extends PlotOptionsGauge {

    private Number overshoot;

    public Number getOvershoot() {
        return overshoot;
    }

    public void setOvershoot(Number overshoot) {
        this.overshoot = overshoot;
    }

}