Javascript 如何更改 Highcharts 中的文本颜色
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8607365/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change the text color in Highcharts
提问by benekastah
This should be pretty simple, but I've pored over the highcharts documentation and can't seem to find an option that specifically addresses the text color (in contrast, there are specific color options for backgrounds, borders, lines, etc.). Then I came across the chart.styleoption. It seemslike it should work -- but doesn't.
这应该很简单,但我仔细阅读了 highcharts 文档,似乎找不到专门解决文本颜色的选项(相比之下,背景、边框、线条等有特定的颜色选项)。然后我遇到了chart.style选项。它看起来像它应该工作-但没有。
In this jsfiddle demoyou'll see that I was able to change the font-family, but not the color.
在这个jsfiddle 演示中,您将看到我能够更改字体系列,但不能更改颜色。
What am I missing?
我错过了什么?
回答by maialithar
check this example, i was able to change labels colours on your jsfiddle. here's whole options parameter:
检查此示例,我能够更改您的 jsfiddle 上的标签颜色。这是整个选项参数:
Highcharts.setOptions({
chart: {
style: {
fontFamily: 'monospace',
color: "#f00"
}
},
title: {
style: {
color: '#F00',
font: 'bold 16px "Trebuchet MS", Verdana, sans-serif'
}
},
xAxis: {
gridLineWidth: 1,
lineColor: '#000',
tickColor: '#000',
labels: {
style: {
color: '#F00',
font: '11px Trebuchet MS, Verdana, sans-serif'
}
},
title: {
style: {
color: '#333',
fontWeight: 'bold',
fontSize: '12px',
fontFamily: 'Trebuchet MS, Verdana, sans-serif'
}
}
},
yAxis: {
minorTickInterval: 'auto',
lineColor: '#000',
lineWidth: 1,
tickWidth: 1,
tickColor: '#000',
labels: {
style: {
color: '#F00',
font: '11px Trebuchet MS, Verdana, sans-serif'
}
},
title: {
style: {
color: '#333',
fontWeight: 'bold',
fontSize: '12px',
fontFamily: 'Trebuchet MS, Verdana, sans-serif'
}
}
},
});
回答by BananaNeil
almost every option in high charts can have style applied to it, like I have done to the y-axis in this example:
几乎高图中的每个选项都可以应用样式,就像我在这个例子中对 y 轴所做的那样:
I would also recommend going to this page,
我也建议去这个页面,
http://www.highcharts.com/demo/combo-dual-axes
http://www.highcharts.com/demo/combo-dual-axes
and clicking "view options" to get an idea of other ways the 'style' option can be used to color text.
并单击“查看选项”以了解“样式”选项可用于为文本着色的其他方式。
回答by WooHoo
Looking through the highcharts.src.js you can style the individual elements for example I changed chart in your example to title and the color is picked up;
查看 highcharts.src.js,您可以设置各个元素的样式,例如我将示例中的图表更改为标题,然后颜色被选取;
title: {
style: {
fontFamily: 'monospace',
color: "#f00"
}
}