作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个现有的 Highcharts ,我需要在其上突出显示单个列。
这是一个已经存在了一段时间的百分位图,我对 Highcharts 仍然很陌生,但我在这里看到了一个类似的问题,这个问题虽然涉及堆叠条形图和点击事件.. .
示例中的代码对我来说很有意义,但我想我遗漏了一些东西,
这是我的示例(试图突出显示第 24 列) https://jsfiddle.net/52t43y3k/2/
这是我看到的问题: Highlight one bar in a series in highcharts?
作为引用,我的代码是
var col_chart = $('#section-2-chart').highcharts({
chart: {
type: 'column'
},
tooltip: { enabled: false },
credits:false,
title: false,
xAxis: {
title:{text:'PERCENTILES'},
type: 'Percentile',
labels: {
enabled:true,
formatter: function() {
return this.value*2;
}
}
},
yAxis: {
min: 0,
title:{text:'Total Image Weight'}
},
legend: {
enabled: false
},
series: [{
data: [169,12003,38308.5,61739.7,97069,131895.5,161086.7,198758.7,219779.3,243567.7,276607.7,296931.5,327457.5,362840.3,383978,410685.5,443774,467039.5,491654,517205,544754.7,578468.3,605392.5,644214.5,693765,766953.7,806616,855380.7,894161,942282,1001179.7,1062697.7,1125773.3,1186437,1236893.7,1314379.5,1378944,1454090.3,1553065,1689346,1833150,1957396,2077851.5,2228644.7,2390102,2725365.5,3147844.3,3607372,4239281.5,5190061,9422370.8],
tooltip: {
pointFormat: '<b>{point.y:f} Bytes</b>'
}
}]
});
//TRIED THIS AND series.data[24] - essentially the 24th bar should be highlighted
col_chart.series[0].data[24].update({color:'red'});
最佳答案
您需要访问highcharts
离开你的 jquery 对象:
col_chart.highcharts().series[0].data[24].update({
color: 'red'
});
为清楚起见
在您的示例中,以下情况正确:
console.log(col_chart instanceof jQuery); // true
来自 highcharts 来源:
/**
* Register Highcharts as a plugin in jQuery
*/
if (win.jQuery) {
win.jQuery.fn.highcharts = function () {
var args = [].slice.call(arguments);
if (this[0]) { // this[0] is the renderTo div
// Create the chart
if (args[0]) {
new Highcharts[ // eslint-disable-line no-new
isString(args[0]) ? args.shift() : 'Chart' // Constructor defaults to Chart
](this[0], args[0], args[1]);
return this;
}
// When called without parameters or with the return argument, return an existing chart
return charts[attr(this[0], 'data-highcharts-chart')];
}
};
}
含义,highcharts()
是 jQuery 的插件,因此您可以通过调用 highcharts
来访问它(假设它已经附加到 dom 元素,如上面的情况)关闭 jQuery 选择器实例。
关于javascript - 加载时在 Highcharts 中突出显示单个条形/柱形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37823900/
有没有一种方法可以“标记”对象的属性,使它们在反射中“突出”? 例如: class A { int aa, b; string s1, s2; public int AA
我是一名优秀的程序员,十分优秀!