G2 - The Grammar Of Graphics

饼图 / 嵌套饼图

源码

<!DOCTYPE html>
                                    <html>

<script src="https://a.alipayobjects.com/g/datavis/g2-mobile-all/2.1.7/index.js "></script>
                                    </head>

GM.Global.pixelRatio = 2;
var  data = [
  {a: '1', b: 0.2, c: '1'},
  {a: '2', b: 0.5, c: '1'},
  {a: '3', b: 0.4, c: '1'},

{a: '1', b: 0.8, c: '2'},
  {a: '2', b: 0.5, c: '2'},
  {a: '3', b: 0.6, c: '2'}
];

var chart = new GM.Chart({
  id: 'c1'
});

chart.source(data);

chart.coord('polar', {
  transposed: true,
  inner: 0.5
});

chart.axis(false);
chart.intervalStack().position('a*b').color('c');
chart.render();

</script>

</body>

</html>