zoukankan      html  css  js  c++  java
  • react中用highcharts画蜘蛛图

    import React from 'react'
    import styles from './Spider.css'
    import Highcharts from 'highcharts-release/highstock'
    import 'highcharts-release/highcharts-more'
    
    type Props = {
      xData: Array,
      chartData: Array,
      title: String
    }
    class Spider extends React.Component {
      props: Props
    
      componentDidMount () {
        this.draw()
      }
    
      draw () {
        const container = this.refs.container
        Highcharts.chart(container, {
          chart: {
            backgroundColor: 'transparent',
            polar: true,
            type: 'line'
          },
          title: {
            text: this.props.title,
            x: -20
          },
          credits:{
            enabled: false
          },
          tooltip: {
            shared: true
          },
          legend: {
            align: 'right',
            verticalAlign: 'top',
            y: 70,
            layout: 'vertical'
          },
          xAxis: {
            categories: this.props.xData,
            tickmarkPlacement: 'on',
            lineWidth: 0
          },
          yAxis: {
            gridLineInterpolation: 'polygon',
            lineWidth: 0,
            min: 0
          },
          series: this.props.chartData
        })
      }
    
      render () {
        return (
          <div ref='container' className={styles['container']} />
        )
      }
    }
    export default Spider
  • 相关阅读:
    vue中封装公共方法,全局使用
    element-ui table 最后一行合计,单元格合并
    vuex 进行封装
    vue生命周期
    (转)no terminal library found
    解压
    (转)bash: make: command not found
    (转)linux 批量删除文件命令
    python
    Session
  • 原文地址:https://www.cnblogs.com/susu8/p/9173988.html
Copyright © 2011-2022 走看看