javascript - 使用 jChartFX 改变饼图比例

标签 javascript css css3pie jchartfx

有什么想法可以改变图表相对于其父图表 div 的比例吗?

目前看起来是这样

enter image description here

...它应该看起来像这样 enter image description here

可以在此处找到用作此示例基础的代码

http://support.softwarefx.com/jChartFX/article/2501235#27182674-0690-e211-84a5-0019b9e6b500


HTML

<!DOCTYPE html>
<html>
<head>
   <title>Customized Tooltips</title>
   <link rel="stylesheet" type="text/css" href="http://www.jchartfx.com/libs/v7/current/styles/jchartfx.css"/>
   <link rel="stylesheet" type="text/css" href="sample.css"/>

   <script type="text/javascript" src="http://www.jchartfx.com/libs/v7/current/js/jchartfx.system.js"></script>
   <script type="text/javascript" src="http://www.jchartfx.com/libs/v7/current/js/jchartfx.coreVector.js"></script>
   <script type="text/javascript" src="http://www.jchartfx.com/libs/v7/current/js/jchartfx.coreVector3d.js"></script>
   <script type="text/javascript" src="http://www.jchartfx.com/libs/v7/current/js/jchartfx.advanced.js"></script>
   <script type="text/javascript" src="http://www.jchartfx.com/libs/v7/current/js/jchartfx.animation.js"></script>
   <script type="text/javascript" src="sample.js"></script>

</head>
<body>
    <div id="ChartDiv1" style="width:550px;height:400px;display:inline-block"></div>
</body>
</html>



  var chart1;

  function onLoadDoc() {
        chart1 = new cfx.Chart();
        chart1.setGallery(cfx.Gallery.Pie);
        chart1.getAnimations().getLoad().setEnabled(true);
        var pie = chart1.getGalleryAttributes();
        pie.setExplodingMode(cfx.ExplodingMode.First);

        chart1.getView3D().setEnabled(true);
        chart1.getLegendBox().setVisible(true);

        //...
    }

最佳答案

您可以使用边距属性:

chart1.getPlotAreaMargin().setTop(0);
chart1.getPlotAreaMargin().setBottom(0);
chart1.getPlotAreaMargin().setRight(0);
chart1.getPlotAreaMargin().setLeft(0);

关于javascript - 使用 jChartFX 改变饼图比例,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18579777/

相关文章:

javascript - 使用 React + Redux 获取所有选中的复选框及其相关数据

javascript - &lt;script&gt; 标签如何强制 MutationObserver 在 Declarative Shadow DOM 中提前运行?

html - CSS 下拉 div

javascript - CSS3 : Lines of text sliding into page at different times

html - 为什么在 CSS 文件中使用绝对路径时 CSS3 PIE 在子页面上不起作用?

javascript - 如何在 Javascript 中使用 DOJO 创建静态类

JavaScript 从函数返回值

php - 选择什么类来删除 URL 下划线?

javascript - CSS3 多列布局 : How to style a particular column

html - Css3pie 支持