Форматировать метки на диаграммах AG-Grid - PullRequest
0 голосов
/ 09 января 2020

Как я могу отформатировать метки, которые появляются на оси диаграммы AG-Grid? У меня много данных временных рядов, поэтому я ожидаю, что пользователи будут часто создавать диаграммы, где горизонтальная ось является датой. К сожалению, это приводит к нечитаемым меткам диаграмм, потому что даты не отформатированы (см. Прикрепленное изображение). Эти метки выглядят как «Чт 09 января 2020 00:00:00 GMT + 0000 (время по Гринвичу»), «когда все, что я хотел бы, это просто» 2020-01-09" . My Даты в сетке выглядят хорошо благодаря valueFormatter для дат.

Также очень часто пользователи создают сводные таблицы, используя дату. Это приводит к таким же ужасным результатам для меток, но я обнаружил, что могу использовать «processSecondaryColGroupDef» для форматирования дат, которые появляются в заголовках столбцов. Есть ли аналогичный способ сделать это для диаграмм?

Спасибо, Трой. enter image description here

1 Ответ

0 голосов
/ 24 января 2020

Из документов -

Для временных осей может быть предоставлена ​​строка формата, которая будет использоваться для форматирования данных для отображения в виде меток осей

You Можно либо явно установить тип оси на «время», но вы также можете удалить это, и диаграмма все равно будет использовать ось времени, так как она автоматически определяет тип оси из данных в столбце «Дата».

Вы можете реализовать processChartOptions обратный вызов и добавить свои настройки -

processChartOptions(params) {
    var options = params.options;
    var dateFormatter = function(params) {
      return params.value.value && para[enter link description here][1]ms.value.value.toLocaleDateString
        ? params.value.value.toLocaleDateString()
        : params.value;
    };
    if (["line"].indexOf(params.type) < 0) {
      if (options.xAxis && options.yAxis) {
        options.xAxis.label.formatter = dateFormatter;
        options.yAxis.label.formatter = dateFormatter;
      }
    } else {
      options.xAxis.type = "time";
      options.xAxis.label.format = "%d %B";
    }

Пример и подробности здесь

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...