在Dimple.JS中创建不完整的饼图 [英] Creating an incomplete pie chart in Dimple.JS
本文介绍了在Dimple.JS中创建不完整的饼图的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个饼图，它需要缺少10％的缺失切片.我有以下代码，但派总是100％.
I have a pie chart that needs to have a missing 10% missing slice. I have the following code but the pie is always 100%.
var myChart = new dimple.chart(svg, data);
myChart.setBounds(50, 50, 180, 180);
myChart.defaultColors = chartOptions.colors;
myChart.data.startAngle = 0;
myChart.data.endAngle = (2 * Math.PI * 0.9);
myAxis = myChart.addMeasureAxis('p', 'amount');
var mySeries = myChart.addSeries('legend', dimple.plot.pie);
我如何使馅饼的含量小于100％?上面的示例需要使pe为90％.
How do I make the pie less than 100%? The above example needs to have the pe be 90 percent.
推荐答案
我看到的将dimple.js中的 hack 唯一的方法是使用伪造的数据点，在绘制之后隐藏起来:
The only way I can see to hack this into dimple.js is with a fake datapoint, you hide after the draw:
<!DOCTYPE html>
<html>
<head>
<script data-require="d3@3.4.6" data-semver="3.4.6" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.4.6/d3.min.js"></script>
<script data-require="dimplejs@2.1.2" data-semver="2.1.2" src="//cdnjs.cloudflare.com/ajax/libs/dimple/2.1.2/dimple.latest.min.js"></script>
</head>
<body>
<script>
var svg = d3.select('body')
.append('svg')
.attr('width', 500)
.attr('height', 500);
var data = [
{ "legend":"one", "amount": 2000 },
{ "legend":"two", "amount": 2000 * 0.10 }
];
var myChart = new dimple.chart(svg, data);
myChart.setBounds(50, 50, 180, 180);
myAxis = myChart.addMeasureAxis('p', 'amount');
var mySeries = myChart.addSeries('legend', dimple.plot.pie);
myChart.draw();
d3.select(".dimple-two")
.style("display", "none");
</script>
</body>
</html>
这篇关于在Dimple.JS中创建不完整的饼图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
