如何设置图例(jqplot)中各个标签的颜色?
我正在使用 jqplot 在页面上绘制图表。我正在绘制多条线,我需要显示一个图例,这将有助于识别这些线。
这些线条有不同的颜色,所以我需要找到一种方法来设置图例中显示的各个标签的颜色。
var plot3 = jQuery.jqplot('div1', [data1, data2, data3, data4],
{
// Series options are specified as an array of objects, one object
// for each series.
series:[
{
color: '#FF0000',
// Change our line width and use a diamond shaped marker.
lineWidth:2,
markerOptions: { style:'diamond' }
},
{
color: '#00FF00',
// Don't show a line, just show markers.
// Make the markers 7 pixels with an 'x' style
showLine:false,
markerOptions: { size: 7, style:"x" }
},
{
color: '#0000FF',
// Use (open) circular markers.
markerOptions: { style:"circle" }
},
{
color: '#F0000F',
// Use a thicker, 5 pixel line and 10 pixel
// filled square markers.
lineWidth:5,
markerOptions: { style:"filledSquare", size:10 }
}
],
legend:{
renderer: jQuery.jqplot.EnhancedLegendRenderer,
show: true,
labels: ['data1', 'data2', 'data3', 'data4']
}
}
[编辑]
我已经删除了之前的代码 - 因为它是一个转移注意力的内容。我还更改了标题,以反映我在努力解决问题几天后尝试解决问题的新方法。
I am using jqplot to plot a chart on a page. I am plotting multiple lines and I need to display a legend which will help identify the lines.
The lines have different colors, so I need to find a way of setting the coklor of individual labels displayed in the legend.
var plot3 = jQuery.jqplot('div1', [data1, data2, data3, data4],
{
// Series options are specified as an array of objects, one object
// for each series.
series:[
{
color: '#FF0000',
// Change our line width and use a diamond shaped marker.
lineWidth:2,
markerOptions: { style:'diamond' }
},
{
color: '#00FF00',
// Don't show a line, just show markers.
// Make the markers 7 pixels with an 'x' style
showLine:false,
markerOptions: { size: 7, style:"x" }
},
{
color: '#0000FF',
// Use (open) circular markers.
markerOptions: { style:"circle" }
},
{
color: '#F0000F',
// Use a thicker, 5 pixel line and 10 pixel
// filled square markers.
lineWidth:5,
markerOptions: { style:"filledSquare", size:10 }
}
],
legend:{
renderer: jQuery.jqplot.EnhancedLegendRenderer,
show: true,
labels: ['data1', 'data2', 'data3', 'data4']
}
}
[Edit]
I have removed the previous code - as it was a red herring. I have also changed the title to reflect the new way I am trying to solve the problem, after struggling with it for days.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
在图例之后,请像这样添加:
这将为您提供图例名称。
After legend, please add it like this:
This will give you legend name.
您可以使用
seriesColors
设置系列和图例的颜色,如下所示:You can set the color on the series and on the legend by using
seriesColors
as follows: