Question

我有下图，我想在图例项之间添加空格。我尝试将空格附加到传递给标签的字符串，但没有成功。有任何想法吗？ TIA

Graph code

       $(document).ready(function() {
            $.plot($("#NR"), NRLine,  {
                grid: {
                    backgroundColor: "#E5E5E5",
                    hoverable: true
                },
                xaxis: {
                    mode: "time",
                    timeformat: "%m/%d",
                    minTickSize: [7, "day"],
                    ticks: datearray


                        },
                        legend: {


                        noColumns: 4,
                        container: $("#chartLegend")} 


    }
     );
        });

code

Answer 1

图例标签位于类legendLabel的容器中，因此您只需要根据需要定义CSS。将其放入您的页面<head>标记：

<style>
  #chartLegend .legendLabel { padding-right:10px; }
</style>

这就是它的样子：http://jsfiddle.net/ryleyb/SZUuV/1/

Answer 2

@Lyley的回答很好。如果您想要更多地控制每个标签，可以放置HTML mark-up in the label itself：

label: '<span style="padding-right:60px;">foo</span>'

Answer 3

您能提供一段代码吗？在我看来，this可能是您需要的解决方案。使用labelFormatter以您需要的方式强制设置。

如何在FLOT中的图例项之间添加空格？

3 个答案: