jqPlot與傳說問題的甜甜圈圖表

我有jqplot甜甜圈圖表，我想在中心部分添加圖表標籤。還想在圖表中間添加標籤捲動。因此只有中間的1-2個標籤可見，並且在用戶滾動時可以看到其餘的標籤。jqPlot與傳說問題的甜甜圈圖表

請看看附圖。據我所知，我們不能在圖表中心添加標籤。有沒有辦法做到這一點？感謝你的幫助。

我當前的代碼如下：

<script type="text/javascript"> 
var _chart5_plot_properties; 
    _chart5_plot_properties = { 
    title: " ", 
    "seriesDefaults":{ 
      renderer:$.jqplot.DonutRenderer,    
      rendererOptions:{ 
      sliceMargin: 0, 
      innerDiameter: 220, 
      startAngle: -90, 
      barPadding: 0, 
      padding: 3, 
      } 
     }, 
     grid: { 
     shadow: false, 
     drawBorder: false, 
     shadowColor: "transparent" 
     }, 
     highlighter: { 
     show: true,    
     tooltipLocation: "sw",   
     useAxesFormatters:false 
     } 
} 
plot2 = $.jqplot("chart2", chart_data, _chart5_plot_properties);

Example is attached

來源

2014-07-16 Nilesh

我無法找到jqPlot此選項。雖然，jqPlot有8個選項來定位圖例，但它沒有中心選項。 jqPlot Legend Locations

但調整了一下後，我可以使用jQuery來完成它。由於我們需要jQuery來繪製/繪製jqPlot圖表，所以我想到了使用jQuery而不是純Javascript。

我用了兩個功能defineDimensionsForLegendTable(parentContainerID, dimensions)和fixLegendsToCenter(parentContainerID)

其他重要的東西，你不應該錯過使用這些函數

請務必包括jquery.jqplot.js，jqplot.pieRenderer.js，jqplot.donutRenderer.js，jquery.jqplot.css文件（或縮小版本 - .min.js）
將placement設置爲outsideGrid在legendOptions
legend: { show:true, placement: 'outsideGrid' }
給予較高的z-index傳說表
#chart2 .jqplot-table-legend{ z-index: 99999; }

在這裏找到工作小提琴 - jqPlot Donut Chart with legend in the center

注：如果圖表不在Google Chrome瀏覽器中顯示，請嘗試在Firefox或其他瀏覽器中打開它。

從代碼;-)

取出console.log線可以使用Foundation或Bootstrap美化滾動條。 :-)

希望它有幫助:-)

來源

2014-09-22 19:22:24

jqPlot與傳說問題的甜甜圈圖表

回答

相關問題