import BoxContent from '@/components/Common/BoxContent'
import { Bar } from '@ant-design/plots'
import React from 'react'
import './index.less'

const DemoBar = (props: any) => {
  const data = [
    {
      year: '无人车',
      value: 11
    },
    {
      year: '无人机',
      value: 1
    },
    {
      year: '无人船',
      value: 1
    },
    {
      year: '红绿灯',
      value: 3
    },
    {
      year: '监控',
      value: 3
    }
  ]
  const config = {
    data,
    xField: 'value',
    yField: 'year',
    seriesField: 'year',
    legend: {
      position: 'top-left'
    }
  } as any
  return (
    <>
      <BoxContent {...props}>
        <div id="Bar">
          <Bar {...config} />
        </div>
      </BoxContent>
    </>
  )
}
export default React.memo(DemoBar)
