我有一个我用flot呈现的基本条形图(5个条形图,显示每个状态的%).
$.plot($("#placeholder"), [
{
label: 'Failed',
data: [[0,10]],
bars: { show: true }
},
{
label: 'Passed',
data: [[1,15]],
bars: { show: true }
},
{
label: 'Not Run',
data: [[2,30]],
bars: { show: true }
},
{
label: 'Blocked',
data: [[3,5]],
bars: { show: true }
},
{
label: 'In Progress',
data: [[4,40]],
bars: { show: true }
}
],
{
xaxis: {
ticks: [[0.5, "Failed"], [1.5, "Passed"], [2.5, "Not Run"], [3.5, "Blocked"], [4.5, "In Progress"]]
},
legend: {
show: false
}
});
Run Code Online (Sandbox Code Playgroud)
我发现用于x轴上的刻度值的字体有点太大,特别是当图表以小尺寸显示时,即.240x100.我已阅读API文档,但无法找到如何控制刻度标签大小.
这可能是OOTB吗?
小智 17
您似乎无法通过API设置字体大小,但您可以使用css来设置刻度标签的大小.
.tickLabel { font-size: 80% }
Run Code Online (Sandbox Code Playgroud)
小智 12
以下是直接来自API的示例:
xaxis:{
font:{
size:11,
style:"italic",
weight:"bold",
family:"sans-serif",
variant:"small-caps"
}
}
Run Code Online (Sandbox Code Playgroud)
http://flot.googlecode.com/svn/trunk/API.txt
以上两个答案不适用于最新版本的flot,因为它们不再使用"真实"文本(而是绘制文本).而是指定以下选项:
{xaxis: {font: size: some_number}, yaxis: {font: size: some_number}}
(some_number以点数替换所需的大小)
| 归档时间: |
|
| 查看次数: |
21619 次 |
| 最近记录: |