Flot中的轴标签

有谁知道如何在Flot中设置轴的标签或标题？

我已经阅读了API，但似乎没有这个function…

谢谢 ：）

Answer 1

没有内置的flot。

你最好的select是通过定位的div来自己做，但如果你冒险的话，你可以看看这个问题 （或者原始问题 ），看看其他人是如何处理它的。

具体来说，最近有两个人做了与标签相关的修改：

https://github.com/RuiPereira/flot/raw/axislabels/jquery.flot.axislabels.js

http://github.com/xuanluo/flot-axislabels

Answer 2

我正在使用这个解决方法：

yaxis: { tickFormatter: function(val, axis) { return val < axis.max ? val.toFixed(2) : "CZK/l";} } 

非常简单，Y轴上的最大值被自定义string替代。 我没有在X轴上进行testing，但我没有看到为什么它不应该工作。

Answer 3

无耻的自我插件：我修正并大大扩展了xuanluo的flot-axislabels插件： http ://github.com/markrcote/flot-axislabels/据我所知，这是目前最好的轴标签解决scheme。

Answer 4

我看到一个很好的build议是把图放在3×3表的中间。 然后标签可以放在其他单元格中。

 <table style="text-align:center"> <tr> <td></td> <td>Plot Title Goes Here</td> <td> </td> </tr> <tr> <td>Y Axis Label</td> <td> <div id="graph here" style="width:600px;height:300px"></div> </td> <td></td> </tr> <tr> <td></td> <td>X Axis Label Goes Here</td> <td></td> </tr> </table> 

Answer 5

jqPlot支持这个，因为你可以使用替代

http://www.jqplot.com

Answer 6

这一个已修复使用多轴，偏移量也很好… https://github.com/mikeslim7/flot-axislabels

Answer 7

2dims图（x和y轴）用纯css解决的例子。

Y轴：

 #placeholder:after { content: 'Speed'; position: absolute; top: 50%; left: -50px; font-weight: 600; /* Safari */ -webkit-transform: rotate(-90deg); /* Firefox */ -moz-transform: rotate(-90deg); /* IE */ -ms-transform: rotate(-90deg); /* Opera */ -o-transform: rotate(-90deg); /* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); } 

X轴：

 #placeholder:before { content: 'Time'; position: absolute; bottom: -30px; left: 50%; font-weight: 600; } 

Answer 8

 $("<div class='axisLabel yaxisLabel'></div>") .text("Pressure") .appendTo($("#yl_1")); 

这也会起作用。