Есть ли способ передать некоторые дополнительные данные объекту серии, который будет использоваться для отображения во всплывающей подсказке диаграммы?
например
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+
Highcharts.dateFormat('%b %e', this.x) +': '+ this.y;
}
здесь мы можем использовать только series.name, this.x и this.y для серии. Допустим, мне нужно передать другое динамическое значение отдельно с набором данных и получить доступ через объект серии. Это возможно?
Спасибо всем заранее.
series
объекту дополнительные данные и отображать их в этом обработчике?Ответы:
Да, если вы настроили объект серии, как показано ниже, где каждая точка данных является хешем, вы можете передать дополнительные значения:
Во всплывающей подсказке вы можете получить к нему доступ через атрибут "point" переданного объекта:
Полный пример здесь: https://jsfiddle.net/burwelldesigns/jeoL5y7s/
источник
Кроме того, с помощью этого решения вы даже можете разместить несколько данных в любом количестве :
Спасибо, Ник.
источник
datetime
значение x, но мы хотим добавить дополнительные данные во всплывающую подсказку.Для данных временных рядов, особенно с достаточным количеством точек данных для активации турбо-порога , предложенные выше решения не будут работать. В случае турбо-порога это связано с тем, что Highcarts ожидает, что точки данных будут массивом, например:
Чтобы не потерять преимущества турбо-порога (что важно при работе с большим количеством точек данных), я храню данные за пределами диаграммы и ищу точку данных в
formatter
функции всплывающей подсказки . Вот пример:Этот подход будет работать для всех типов диаграмм.
источник
data: _.map(data, row => [row['timestamp'], row['value']])
бытьdata: chartData.map(row => [row.timestamp, row.value])
? Кроме того, вам не нужен lodash; вы можете использовать Array.find . Он не поддерживается IE, но вы уже используете ES6 (const
), а MS перестала поддерживать IE в 2016 году .chartData
. Я привык использовать lodash, но ты прав. Я обновил свой пример, так что он не зависит от библиотеки. Спасибо.Я использую AJAX для получения данных с SQL Server, а затем подготавливаю массив js, который используется в качестве данных в моей диаграмме. Код JavaScript после успешного выполнения AJAX:
Теперь, чтобы показать дополнительные метаданные во всплывающей подсказке:
Я использую DataRow для перебора моего набора результатов, затем использую класс для присвоения значений перед передачей обратно в формате Json. Вот код C # в действии контроллера, вызываемом Ajax.
Я понимаю, что есть более эффективный и приемлемый способ кодирования на C #, но я унаследовал этот проект.
источник
Просто чтобы добавить динамизма:
Это сделано для создания данных для столбчатой диаграммы с накоплением с 10 категориями.
Я хотел иметь для каждой категории 4 ряд данных и хотел отображать дополнительную информацию (изображение, вопрос, отвлекающий фактор и ожидаемый ответ) для каждой серии данных:
В разделе highcharts:
Надеюсь, это кому-то поможет.
источник