去除餅圖圖例上的色板邊框（jqplot）

如何去除JQPlot圖形圖例中色板周圍的邊框？以下是我的代碼。樣本週圍有邊框，但邊框比廣場大，我寧願將其移除。那麼這可能是第二個問題（如果有人只是回答一個問題，我會刪除它）：我有4組每個片的原始數據。如何以顯示更多這個數據的傳說（如：名稱，金額和百分比）我去除餅圖圖例上的色板邊框（jqplot）

下面是代碼有：

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. 
       } 
      } 
     );

來源

2013-10-23 user990855

您可以通過重寫CSS類刪除大綱：

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

關於第二個問題，你可以使用傳說中的「標籤」選項：

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

並在調用jqplot函數之前填充如下所示的legendLabels數組：

var legendLabels= ['label1 with data or %', 'label2 with data or %', 'label3 with data or %'];

來源

2013-10-23 13:44:10

去除餅圖圖例上的色板邊框（jqplot）

回答

相關問題