1

如何删除 JQPlot 图图例中色板周围的边框？下面是我的代码。样本周围有边框，但边框比正方形大，我更愿意将其删除。那么这可能是第二个问题（如果有人只回答一个问题或要求我回答，我会删除）：每个切片都有 4 组原始数据。如何在图例中显示更多此类数据（例如：名称以及数量和百分比）

下面是我的代码：

var budgetGraph = [["GROCERIES",4194.02,57.95302704323518,10],["BUSINESS MISCELLANEOUS",918.19,12.68756226742555,102],["HEALTHCARE/MEDICAL",729.65,10.082313909351063,11],["HOBBIES/SPORT",502.56,6.944381111880313,34],["OTHER EXPENSES",492.7,6.808135493918,19],["Other",399.81,5.524580174189884,0]];
var plot1 = jQuery.jqplot ('budgetGraph', [budgetGraph],
            {
                seriesDefaults: {
                    // Make this a pie chart.
                    renderer: jQuery.jqplot.PieRenderer,
                    rendererOptions: {
                    },
                    seriesColors: graphColours.pie
                },
                legend: {
                    renderer: jQuery.jqplot.PieLegendRenderer,
                    show: true,
                    renderOptions: {
                        numberColumns: 3
                    },
                    location: 'e',
                    placement: 'outside',
                    border: 'none'
                },
                grid: {
                    drawGridLines: false,        // wether to draw lines across the grid or not.
                    gridLineColor: 'transparent',   // CSS color spec of the grid lines.
                    background: 'transparent',      // CSS color spec for background color of grid.
                    borderColor: 'transparent',     // CSS color spec for border around grid.
                    borderWidth: 0.0,           // pixel width of border around grid.
                    shadow: false               // draw a shadow for grid.
                }
            }
        );
4

1 回答 1

3

You can remove the outline by overriding the css class:

.jqplot-table-legend-swatch-outline { border: 0 solid #CCCCCC;}

For your second question you can use the "labels" option of the legend:

legend: {
        show: true,
        location: 'ne',
        placement: "outside",
        labels: legendLabels
    }

and before calling the jqplot function populate the legendLabels array like this:

var legendLabels= ['label1 with data or %', 'label2 with data or %', 'label3 with data or %'];
于 2013-10-23T13:44:10.343 回答