如何修复c3js中的圆环图表大小

时间:2016-03-14 19:12:05

标签: angularjs charts c3.js

我无法修复c3js中的甜甜圈大小。每当图例中的标签数量和标签长度增加时,我需要增加图表大小以适应它们。但这会影响其他图表,而图例中的标签数量较少。为了保持一致,我对页面中显示的所有圆环图使用相同的图表大小。但根据传奇标签,甜甜圈的大小各不相同,看起来不太好。有关如何修复甜甜圈大小的任何建议,无论图例标签如何。我正在使用填充将图例放在图表的右侧。

您可以在下面找到生成图表的代码:

<c3chart bindto-id={{id}} chart-data="piePoints" chart-columns="pieColumns" padding-left="0" padding-right="300" padding-top="0" padding-bottom="0">
                <chart-size chart-width="400" chart-height="300" />
                <chart-donut width="40" expand="false" show-label="true"></chart-donut>
                <chart-legend show-legend="true" legend-position="right" />
                <chart-tooltip show-tooltip="false"/>
            </c3chart>

在下面的小提琴中,我有3个由c3js生成的图表。我想修改图表的大小,但可以看出甜甜圈的大小因图例而异。

https://jsfiddle.net/anu23/qzew784d/2/

无论图例标签长度和图例中的标签数量是多少,都能保持圆环尺寸固定。

0 个答案:

没有答案