flot - How do I change the style of the legend in Flot?

Question

I have just changed my version of Flot from 0.6 to 0.7, however, when I do this, the legend in my Flot graph changes style. Previously, I had used the "LabelClass" attribute to change the style but on reading the source for 0.7 I see that "labelClass" is no longer an option and I appear to be forced to use the "table" CSS definition that is used throughout the site that I'm working on. Because of this I can't change the site's CSS "table" definition.

Is there another good method for changing the definition of a legend or am I stuck?

Apologies in advance is this is just a newbie question

Kind Regards

Answer 1

它已更改名称，新类legendLabel用于标签和legendColorBox颜色框。

您可以在jquery.flot.js中看到这一点。

编辑作为回应，问题似乎是你如何设计整个表格。假设您的浮点占位符是这样的：

<div id="foo" style="width:600px;height:300px"></div>

然后你可以像这样定义 CSS：

#foo > div.legend > table {
  border: 2px red solid;
}

在这里查看它的实际操作：http: //jsfiddle.net/ryleyb/YkDpG/1/

Answer 2

另一种设置图例样式的方法是在绘制图表后使用 jQuery .css()( http://api.jquery.com/css/ ) 方法。

例如：

$.plot($("#chartFoo"), pieChartData, options);
$("#chartFoo div.legend table").css("border", "1px solid #888888");
$("#chartFoo div.legend table").css("background", "#ffffee");

或者：

$.plot($("#chartFoo"), pieChartData, options);
$("#chartFoo div.legend table").css({ border: "1px solid #888888", background: "#ffffee" });