Question

我有一个简单的JSF折线图，它使用PrimeFaces（通过jqPlot）库：

<p:lineChart id="linear"
             value="#{team.chart}" 
             title="Lap Times" 
             xaxisLabel="Lap"
             yaxisLabel="Time (sec)"
             style="height:300px;width:600px" />

但是，我想更改图表的标题和X / Y标签颜色。我似乎无法找到合适的CSS组合来实现这一目标。例如，以下内容不起作用：

.jqplot-xaxis {
     /* skin */
     font-family: Lucida Grande, Lucida Sans, Arial, sans-serif; 
     color: white ! important;
     font-size: 90%;
 }

有什么想法吗？

Answer 1

这正是我用于图表标题和X / Y标签的内容：

.jqplot-title{
    color: #eeffdd;
}
.jqplot-xaxis-label{
    color: #eeccaa; 
}
.jqplot-yaxis-label{
    color: #eeccaa;
}

.jqplot-xaxis类的设置工作正常，它只会更改xaxis的刻度。你可以通过设置例如快速测试它font-size: 20px;

Answer 2

正如Boro在上述答案的评论中所说，使用CanvasAxisLabelRenderer时，您需要使用：

labelOptions: {textColor: '#eeccaa'}

在xaxis或yaxis对象块中（您引用labelRenderer的地方相同）：

yaxis:{
  label: 'Your Label'
  labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
  labelOptions: {textColor: '#eeccaa'},
  etc...
}

只是认为强调这一点而不是将其隐藏在评论中会很好。

谢谢Boro！

Answer 3

我的工作这段代码

 axes: {
     xaxis: {
          borderColor: "#aa2626",
          tickOptions: {
             textColor: '#aa2626'
             }
          }
        }

如何更改Primefaces / jqPlot折线图的标签颜色？

3 个答案: