2015-08-24 4 views
1

У меня есть комбинированная диаграмма с осью x типа 'date' и двумя y-осями (одна представлена ​​линией, другая - барами). По умолчанию, всплывающие подсказки для обеих серий отображается в следующем формате:Добавление всплывающих подсказок с различными форматами для разных серий

[Date] (MMM dd, y) 
[series title]: [value] 

Я хотел бы всплывающую подсказку для серии бар, который будет отображаться в другом формате, хотя:

[Date] (MMM y) 
[series title]: [value] 

Как изменить формат даты в всплывающей подсказке только для одной из серий? Я попытался изменить его с помощью метода format():

var formatter = new google.visualization.DateFormat({pattern: 'MMM y'}); 
formatter.format(data, 0); 

но это изменило формат всплывающих подсказок обеих серий.

ответ

0

Фактическая реализация функции может быть немного длительным (я предполагаю, что 1+ часов для опытного Google Charts API разработчика, возможно, день для кого-то неопытного.)

Я могу указать вам, однако в правильное направление. Если вы посмотрите на документацию для Custom HTML Tooltips, второй пример показывает использование функции для рендеринга вывода. Если вы делаете что-то подобное (это не должно быть подсказкой HTML, но вы также можете), то вы можете передать свой JavaScript-объект Date функции и отформатировать его самостоятельно только для всплывающей подсказки. Это форматирование не изменит ваши форматы оси.

Примечание. Пример с функцией отображения HTML для всплывающей подсказки имеет намного больше, чем только это происходит. Они используют опцию focusTarget: 'category', которая фокусирует внимание на стоимости данных всей строки, а не только на одну пару значений x, y. Чтобы иметь настраиваемые подсказки для каждой серии, вам понадобится столбец всплывающей подсказки для каждого столбца данных. В документах есть другие части, которые показывают, как настроить DataTables для всплывающих подсказок. Как вы на самом деле напишите это, многое зависит от того, как вы импортируете свои данные.

Ваш формат метода подпись, вероятно, будет выглядеть примерно так: formatTooltip(columnName, date, value), или тоже сделать его более общим: formatTooptip(dateFormatString, date, value). Удачи!

Смежные вопросы