Как изменить стиль легенды во Флоте? - PullRequest
3 голосов
/ 30 марта 2011

Я только что изменил свою версию Flot с 0,6 до 0,7, однако, когда я делаю это, легенда в моем графике Flot меняет стиль. Ранее я использовал атрибут «LabelClass» для изменения стиля, но при чтении исходного кода для версии 0.7 я вижу, что «labelClass» больше не является опцией, и мне кажется, что я вынужден использовать определение CSS «table», которое используется повсеместно сайт, над которым я работаю. Из-за этого я не могу изменить определение CSS "таблицы" сайта.

Есть ли другой хороший способ изменить определение легенды или я застрял?

Заранее извиняюсь, это всего лишь вопрос новичка

С уважением

Ответы [ 2 ]

11 голосов
/ 31 марта 2011

Это изменило имена, все, новый класс legendLabel для меток и legendColorBox для цветовой рамки.

Вы можете увидеть это в jquery.flot.js .

РЕДАКТИРОВАТЬ в ответ кажется, что вопрос в том, как оформить всю таблицу.Предположим, что ваш заполнитель flot выглядит примерно так:

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

Тогда вы можете определить CSS следующим образом:

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

Смотрите это здесь в действии: http://jsfiddle.net/ryleyb/YkDpG/1/

5 голосов
/ 02 апреля 2012

Еще один способ стилизации легенды - использовать метод 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" });
...