图表-echarts等

带刻度的雷达图

2021-12-16  本文已影响0人  芳玥
// prettier-ignore
option = {
  animation: false,
  color: [
    '#e16857',
    '#eecb57',
    '#61a4e8',
    '#9570e5',
    '#605ff0',
    '#7dcf51',
    '#ff7f50',
    '#87cefa',
    '#da70d6',
    '#32cd32',
    '#6495ed',
    '#ff69b4',
    '#ba55d3',
    '#cd5c5c',
    '#ffa500',
    '#40e0d0',
    '#1e90ff',
    '#ff6347',
    '#7b68ee',
    '#00fa9a',
    '#ffd700',
    '#6699FF',
    '#ff6666',
    '#3cb371',
    '#b8860b',
    '#30e0e0'
  ],
  title: {
    text: '风格趋势雷达',
    x: 'center',
    y: 'top',
    padding: [18, 10],
    textStyle: {
      fontSize: 14,
      color: '#666666'
    }
  },
  tooltip: {
    textStyle: {
      fontSize: 12
    },
    backgroundColor: 'rgba(0, 0, 0, 0.7)',
    extraCssText: 'box-shadow: 0 0 6px rgba(0, 0, 0, 0.4);'
  },
  legend: {
    data: ['2021/11', '2021/10', '2021/06'],
    y: 'bottom',
    selectedMode: false
  },
  radar: {
    // radius: 120,
    // startAngle: 90,
    splitNumber: 4, 
    // splitArea: {
    //   show: false
    // },
    // name: {
    //   textStyle: {
    //     color: 'balck'
    //   }
    // },
    // axisLabel: {},
    indicator: [
      {
        axisLabel: {
          show: true
        },
        name: '财务杠杆',
        // min: 0,
        // max: 16
      },
      {
        axisLabel: {
          show: false
        },
        name: '市值',
        // min: 0,
        // max: 16
      },
      {
        axisLabel: {
          show: false
        },
        name: '成长',
        // min: 0,
        // max: 16
      },
      {
        axisLabel: {
          show: false
        },
        name: '流动性',
        // min: 0,
        // max: 16
      },
      {
        axisLabel: {
          show: false
        },
        name: '波动性',
        // min: 0,
        // max: 16
      },
      {
        axisLabel: {
          show: false
        },
        name: '估值',
        // min: 0,
        // max: 16
      },
      {
        axisLabel: {
          show: false
        },
        name: '贝塔',
        // min: 0,
        // max: 16
      },
      {
        axisLabel: {
          show: false
        },
        name: '盈利性',
        // min: 0,
        // max: 16
      },
      {
        axisLabel: {
          show: false
        },
        name: '动量',
        // min: 0,
        // max: 16
      }
    ]
  },
  series: [
    {
      type: 'radar',
      data: [
        {
          name: '2021/11',
          value: [
            15.998832686423341, 6.338972610111871, 11.805093811324156,
            10.3963095373926, 1.6066210212635186, 13.767066356971961,
            0.01887769166170461, 5.75495829961076, 3.2038119772289173
          ]
        },
        {
          name: '2021/10',
          value: [
            13.692718993676907, 6.1865702354568395, 14.544951490483118,
            11.045261122149888, 1.660129749945325, 12.287997580823204,
            1.2420291251985214, 5.814054800589165, 2.7939046957515834
          ]
        },
        {
          name: '2021/06',
          value: [
            16, 6.967284888128151, 6.973686919070198, 9.192795250183515,
            0.04295927726068083, 7.039608528103502, 2.7936275974466063,
            3.8849719561196805, 6.158877320734007
          ]
        }
      ]
    }
  ]
};

这么一个options,也能雷达图带刻度。
卧槽,翻半天文档,都没看到说indicator都能axisLabel,splitNumber控制几等分。

应该object里都能塞axisLabel去试试不同的效用?

上一篇下一篇

猜你喜欢

热点阅读