Как использовать даты на оси X с помощью API диаграммы Google?

UPDATE Теперь это поддерживается непосредственно в Chart API с помощью функции расширенных графиков "аннотированный график" - https://developers.google.com/chart/interactive/docs/gallery/annotationchart.

Я сделал это на своем ReHash Database Statistics графике (хотя даты оказались равномерно разнесенными, так что это не совсем демонстрирует, что он это делает).

Сначала необходимо получить общий период времени, который будет аналогичен общей ширине графика. Для этого мы вычтем самую раннюю дату из самой поздней. Я предпочитаю использовать временные метки Unix-epoch, поскольку они являются целыми числами и их легко сравнивать таким образом, но вы можете легко вычислить количество секунд и т.д.

Теперь пройдитесь по данным. Для каждой даты нам нужен перцентиль в общем периоде, который эта дата составляет от начала (т.е. самая ранняя дата - 0, самая поздняя - 100). Для каждой даты сначала нужно вычислить расстояние текущей даты от самой ранней даты в наборе данных. По сути, "как далеко мы находимся от начала". Итак, вычтите самую раннюю дату из настоящей даты. Затем, чтобы найти процентиль, мы делим расстояние текущей даты на общий период времени, а затем умножаем на 100 и усекаем или округляем любую десятичную дробь, чтобы получить интегральную x-координату.

И это так просто! Значения x будут варьироваться от 0 (левая сторона графика) до 100 (правая сторона), и каждая точка данных будет находиться на расстоянии от начала отсчета, соответствующем ее истинному временному расстоянию.

Если у вас есть какие-либо вопросы, не стесняйтесь спрашивать! При желании я могу выложить pesudocode или PHP.

У меня была такая же проблема, нашли разброса на Google картах, это именно то, что нужно.

Здесь'ы код, я в конечном итоге с (взял их в качестве отправной точки):

function drawVisualization() {
    // Create and populate the data table.
    var data = new google.visualization.DataTable();
    data.addColumn('date', 'Date');
    data.addColumn('number', 'Quantity');
    data.addRow([new Date(2011, 0, 1), 10])
    data.addRow([new Date(2011, 1, 1), 15])
    data.addRow([new Date(2011, 3, 1), 40])
    data.addRow([new Date(2011, 6, 1), 50])

    // Create and draw the visualization.
    var chart = new google.visualization.ScatterChart(
        document.getElementById('visualization'));
    chart.draw(data, {title: 'Test',
                      width: 600, height: 400,
                      vAxis: {title: "cr", titleTextStyle: {color: "green"}},
                      hAxis: {title: "time", titleTextStyle: {color: "green"}},
                      lineWidth: 1}
              );
}

Обратите внимание, что они, кажется, считать месяцы от 0, т. е. январь-0, февраль-1, ..., Декабрь-11.

Похоже, что теперь это можно сделать с помощью расширенных графиков:

http://code.google.com/apis/visualization/documentation/gallery/annotatedtimeline.html

Это можно сделать с помощью диаграмм Google довольно легко, но ваше приложение должно рассчитать метки

Вам нужен параметр chxl chart x label. В следующем примере ось y помечена числами с шагом 50, а нижняя часть - датами

chxl=0:|0|50|100|150|200|250|300|350|400|450|500|1:|16/01/2009|26/01/2009|6/02/2009

Хай. Я'м мышления так же, как и вы. Я предвижу проблемы, где надписи перекрывают друг друга, и кажется, есть только два подхода.

1. выяснить, сколько символов в каждой даты, в зависимости от формата (пн/вт, в понедельник/вторник, 1 января/1 февраля, 1 января, 29 февраля, 14/2/2010 ..и т. д.), а затем посчитать, сколько наклеек можно разместить на диаграмме ширина (которая может усугубится, связанных чар ширина в пикселях (легче для фиксированных шрифтов), или просто несколько пробных & ошибок).

Конечно, ваши ярлыки может соответствовать любые данные.

2. Использование нескольких оси X и месте даты по вертикали.