javascript - 将CSS样式应用于flot中的特定刻度

Question

我想知道如何使用 CSS 应用勾号。比方说，我有一个刻度为 [10, 100, 200, 500, 1000]，我希望 200 的字体更大，颜色为红色。我想要实现的目标是将该刻度标记为图表中的阈值

markings: [ {color: 'red', lineWidth: 3, yaxis: {from:200, to:200}}]

这将画一条线，但我想显示刻度值，让我知道这与其他刻度不同。

我试图做这样的事情，但显然这不起作用，因为它是一个字符串。有什么想法或建议吗？

tickFormatter: function(val, axis) {
    if(val == 200) {
        return ("<div style=\"color: 'red'\">200</div>");
    }
}

Answer 1

1.) 您的 CSS 无效:

style="color: red" // no quotes around 'red'

2.) 当 val != 200 时，您还必须返回一个值

3.) 我建议使用 <span>标签而不是 <div> .

把它们放在一起:

tickFormatter: function(val, axis) {
    if(val == 200) {
        return "<span style=\"color: red\">200</span>";
    } else {
        return val + '';   
    }
}

这是一个工作 fiddle .