主要是显示圆里面按照比例分布 HTML 代码:
<meta charset="UTF-8"> <title>Title</title> <script src="echarts.common.min.js" type="text/javascript"></script> <script type="text/javascript"> // 基于准备好的 dom,初始化 echarts 实例 var myChart = echarts.init(document.getElementById('main')); <pre><code>// 指定图表的配置项和数据 var option = { backgroundColor: '#2c343c', title: { text: 'Python', left: 'center', top: 20, textStyle: { color: '#ccc' } }, // 全局调色盘。 color: ['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83', '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3'], dataset: { source: [['5000 以下', 5], ['5000-7000', 3], ['7000-10000', 12], ['10000 以上', 62]] }, tooltip: { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, visualMap: { show: false, min: 80, max: 600, inRange: { colorLightness: [0, 1] } }, series: [ { name: '职位个数', type: 'pie', radius: '55%', center: ['50%', '50%'], label: { normal: { textStyle: { color: 'rgba(255, 255, 255, 0.3)' } } }, labelLine: { normal: { lineStyle: { color: 'rgba(255, 255, 255, 0.3)' }, smooth: 0.2, length: 10, length2: 20 } }, animationType: 'scale', animationEasing: 'elasticOut', animationDelay: function (idx) { return Math.random() * 200; } } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); </code></pre> </script>这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.