JQPlot图例放在图形外面

Question

我正在使用JQPlot，页面上有很多图形。每个图形都有相同的图例。

我的问题是：是否可以将图例完全显示在图形外，并在HTML页面上或其自己的div中拥有自己的位置？

- Garry

Answer 1

legend:{ 
                show:true,
                    renderer: $.jqplot.EnhancedLegendRenderer,
                    location: 's' ,
                    placement : "outside",
                    marginTop : "30px",
                    rendererOptions: {
                        numberRows: 1
                    }
                 },

您可以像上面的代码一样使用placement："outside"。您可以使用marginTop，marginBottom，marginRight，marginLeft属性移动它。

- DilanG

Answer 2

也许你可以隐藏倒数第二个图表的图例，就像这样：

legend: { show:false}

在第一张图中，可以添加类似以下的内容：

 legend:{
        show:true, 
        placement: 'outside', 
        rendererOptions: {
            numberRows: 1
        }, 
        location:'n'

这样，您只会在图表顶部显示一个图例。

- Pablo Claus

Answer 3

你正在寻找title吗？你可以通过样式.jqplot-title使其呈现不同的外观。默认情况下，它出现在图形之外。

$.jqplot('chartdiv',  [[[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]],
{ title:'Exponential Line',
  axes:{yaxis:{min:-10, max:240}},
  series:[{color:'#5FAB78'}]
});

您还可以重新设计图例。请参见http://www.jqplot.com/docs/files/jqPlotCssStyling-txt.html中的table.jqplot-table-legend。

- Sectio Aurea