Fixed min and max dynamic time ticks in chart

Question

I'm currently working on a graph, which should visualise a fixed time frame. I want to have the start and end of the timeframe fixed on the width of the graph and want to set a custom amount of ticks in between, depending on the timeframe.

I tried to find something in the highcharts docu, but it seems there is nothing for gwt as "tickpositioner" or "tickpositions" for javascript would do. Has anybody an idea how to approach a solution in gwt to achieve this behaviour please?

Answer 1

I found a solution where i set the tickpositioner in the JSONObject and implement the function in javascript. Mind the "positions.info" because due to the tickpositioner function, label predefined label formatting gets lost.

void setXaxisTicks(XAxis xAxis, Long start, Long end) {
    JSONObject options = xAxis.getOptions();
    options.put("tickPositioner", null);
    configureXAxis(options.getJavaScriptObject(), start, end);
}

private native void configureXAxis(JavaScriptObject javaScriptObject, Number start, Number end) /*-{
    javaScriptObject.tickPositioner = function () {
        var positions = [],
        tick = Math.floor(start),
        increment = Math.ceil((end - start));
        for (tick; tick - increment <= end; tick += increment) {
            positions.push(tick);
        }

        tLen = positions.length;

        positions.info = {
            unitName: "minute",
            higherRanks: {},
            totalRange: positions[tLen - 1] - positions[0]
        };

        return positions;
    };

}-*/;