построение графика по оси Y dygraph как времени?

Я предполагаю, что ваши значения y - это что-то вроде количества секунд? Вы можете написать axisLabelFormatter для оси Y, чтобы преобразовать количество секунд в строку, например "1h " или "30м".

Тикер оси Y по умолчанию выбирает хорошие значения для целых чисел, например. 100, 200, 300, что не обязательно является хорошим значением длительности. Чтобы получить это, как вы говорите, вам нужно написать свой собственный тикер.

Это не так сложно, как кажется. Лучшая документация по тикерам находится здесь . Тикер numericTicks — самый простой пример. .

Наконец-то я дошел до написания ответа!

Самое простое решение, которое я нашел, состояло в том, чтобы преобразовать количество (в секундах) в количество минут или часов, по которым оно затем разбивается на хорошие интервалы.

Я обнаружил, что переход на более высокое значение выглядел лучше всего, когда оно было двойным -> поэтому секунды менялись на минуты только тогда, когда время превышало 2 минуты.

Тикер выглядит так:

function dygraphTimeTicker(min, max, pixels, opts, dygraph, vals) {
    //Bigger the physical size of the graph - the more ticks we want
    var stepsAim = Math.ceil(pixels / 50);

    var storemax = Number(max);
    var storemin = Number(min);
    var timeRatio, valueSuffix;

    //Display the ticks as seconds, minutes or hours?
    if (storemax <= 120) { // (seconds) max <= 2 Minutes
        valueSuffix = "s";
        timeRatio = 1;
    } else if (storemax <= 7200) { // (minutes) max <= 2 Hours
        valueSuffix = "m";
        timeRatio = 60;
    } else { // (hours)
        valueSuffix = "h";
        timeRatio = 3600;
    }

    var tempmax = storemax + (timeRatio - (storemax % timeRatio));
    var maxTime = tempmax / timeRatio;

    //give us an array of our 'nice' values
    var labelSteps = gaugeSteps(maxTime, stepsAim);

    var labelArray = [];
    for (var j = 0; j < labelSteps.length; j++) {
        labelArray.push({
            v: labelSteps[j] * timeRatio,
            label: labelSteps[j] + valueSuffix
        });
    }

    return labelArray;
}

dygraphTimeTicker также реализует следующие функции:

//Give us a nice even numbers for our ticks
function calculateEvenStepSize(range, targetSteps) {
    // calculate an initial guess at step size
    var tempStep = range / targetSteps;

    // get the magnitude of the step size
    var mag = Math.floor(Math.log(tempStep) / Math.log(10));
    var magPow = Math.pow(10, mag);

    // calculate most significant digit of the new step size
    var magMsd = Math.round(tempStep / magPow + 0.5);

    // promote the MSD to either 1, 2, or 5
    if (magMsd > 5)
        magMsd = 10;
    else if (magMsd > 2)
        magMsd = 5;
    else if (magMsd > 1)
        magMsd = 2;

    return magMsd * magPow;
};

//Give us the array of values we want displayed as 'major ticks'
function gaugeSteps(max, step) {
    var steps = step || 10;
    var ticks = [];

    //if below steps then we don't want any decimals!
    if (max < steps) {
        for (var i = 0; i <= max; i++) {
            ticks.push(i);
        }
    } else {
        var tickSize = calculateEvenStepSize(max, steps);
        var loopAmount = Math.ceil(max / tickSize);

        for (i = 0; i < loopAmount + 1; i++) {
            ticks.push(i * tickSize);
        }
    }

    return ticks;
}

Инициализация:

new Dygraph(document.getElementById("graph"), data, {
    series: { 'Values': { axis: 'y1' } },
    ylabel: "Time",
    graphType: "Date",
    axes: {
        y: {
            ticker: dygraphTimeTicker,
            includeZero: true,
            valueFormatter: function(val, opts, lineName) {
                //This here is your own formatter
                return ValueToTime(val);
            }
        }
    }
});

Я надеюсь, что это поможет кому-то еще.