百度echarts利用南丁格尔图做一个上班摸鱼时间分布图

如何利用百度echarts南丁格尔图做一个上班摸鱼时间分布图，下面给大家简单介绍一下实现代码！

实现代码如下：

var data = [];
var data2 = [];
for (var i = 0; i < 24; ++i) {
  data.push({
    value: Math.random() * 10 + 10 - Math.abs(i - 12),
    name: i + ':00'
  });
  data2.push({
    value: 1,
    name: i + ':00'
  });
}

option = {
  title: {
    text: '上班摸鱼时间',
    left: '50%',
    textAlign: 'center',
    top: '20%'
  },
  color: ['#22C3AA'],
  series: [{
    type: 'pie',
    data: data,
    roseType: 'area',
    itemStyle: {
      normal: {
        color: 'white',
        borderColor: '#22C3AA'
      }
    },
    labelLine: {
      normal: {
        show: false
      }
    },
    label: {
      normal: {
        show: false
      }
    }
  }, {
    type: 'pie',
    data: data2,
    radius: ['75%', '100%'],
    zlevel: -2,
    itemStyle: {
      normal: {
        color: '#22C3AA',
        borderColor: 'white'
      }
    },
    label: {
      normal: {
        position: 'inside'
      }
    }
  }]
};

百度echarts雷达图radar根据分数点显示每个不同颜色

百度ECharts文档官网介绍

百度echarts柱状图设置不同颜色（每根柱子一种颜色）

百度echarts图表数据为空如何展示"暂无数据"

百度echarts柱状图/折线图x轴显示全部文本（太长自动换行）

标签： 南丁格尔图, 百度echarts

上面是“百度echarts利用南丁格尔图做一个上班摸鱼时间分布图”的全面内容，想了解更多关于 js 内容，请继续关注web建站教程。

当前网址：https://m.ipkd.cn/webs_2888.html

声明：本站提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请发送到邮箱：admin@ipkd.cn，我们会在看到邮件的第一时间内为您处理！