Dataset

Một chỉ số, một chiều

import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "date": "2019",
      "profit": 10
    },
    {
      "date": "2020",
      "profit": 30
    },
    {
      "date": "2021",
      "profit": 30
    },
    {
      "date": "2022",
      "profit": 50
    },
    {
      "date": "2023",
      "profit": 40
    }
  ]
}

  return <VSeedRender vseed={vseedConfig} />
}

Một chỉ số, nhiều chiều

import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "date": "2019",
      "region": "east",
      "city": "A",
      "profit": 10
    },
    {
      "date": "2019",
      "region": "east",
      "city": "B",
      "profit": 30
    },
    {
      "date": "2019",
      "region": "east",
      "city": "C",
      "profit": 30
    },
    {
      "date": "2019",
      "region": "east",
      "city": "D",
      "profit": 50
    },
    {
      "date": "2019",
      "region": "east",
      "city": "E",
      "profit": 40
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "A",
      "profit": 10
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "B",
      "profit": 30
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "C",
      "profit": 30
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "D",
      "profit": 50
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "E",
      "profit": 40
    }
  ]
}

  return <VSeedRender vseed={vseedConfig} />
}

Một chỉ số, không có chiều

import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "profit": 10
    }
  ]
}

  return <VSeedRender vseed={vseedConfig} />
}

Nhiều chỉ số, một chiều

import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "discount": 0.1
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "discount": 0.1
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "discount": 0.1
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "discount": 0.1
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "discount": 0.1
    }
  ]
}

  return <VSeedRender vseed={vseedConfig} />
}

Nhiều chỉ số, nhiều chiều

import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "date": "2019",
      "region": "east",
      "city": "A",
      "profit": 10,
      "sales": 20,
      "discount": 0.1
    },
    {
      "date": "2019",
      "region": "east",
      "city": "B",
      "profit": 30,
      "sales": 60,
      "discount": 0.1
    },
    {
      "date": "2019",
      "region": "east",
      "city": "C",
      "profit": 30,
      "sales": 60,
      "discount": 0.1
    },
    {
      "date": "2019",
      "region": "east",
      "city": "D",
      "profit": 50,
      "sales": 100,
      "discount": 0.1
    },
    {
      "date": "2019",
      "region": "east",
      "city": "E",
      "profit": 40,
      "sales": 80,
      "discount": 0.1
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "A",
      "profit": 10,
      "sales": 20,
      "discount": 0.1
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "B",
      "profit": 30,
      "sales": 60,
      "discount": 0.1
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "C",
      "profit": 30,
      "sales": 60,
      "discount": 0.1
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "D",
      "profit": 50,
      "sales": 100,
      "discount": 0.1
    },
    {
      "date": "2020",
      "region": "north of east",
      "city": "E",
      "profit": 40,
      "sales": 80,
      "discount": 0.1
    }
  ]
}

  return <VSeedRender vseed={vseedConfig} />
}

Nhiều chỉ số, không có chiều

import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "profit": 1,
      "sales": 2,
      "discount": 0.1
    }
  ]
}

  return <VSeedRender vseed={vseedConfig} />
}

Cấu hình chiều dữ liệu và chỉ số

import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "date": "2019",
      "region": "east",
      "profit": 10,
      "sales": 20
    },
    {
      "date": "2020",
      "region": "east",
      "profit": 30,
      "sales": 60
    },
    {
      "date": "2021",
      "region": "east",
      "profit": 30,
      "sales": 60
    },
    {
      "date": "2022",
      "region": "east",
      "profit": 50,
      "sales": 100
    },
    {
      "date": "2023",
      "region": "east",
      "profit": 40,
      "sales": 80
    },
    {
      "date": "2019",
      "region": "north of east",
      "profit": 10,
      "sales": 20
    },
    {
      "date": "2020",
      "region": "north of east",
      "profit": 30,
      "sales": 60
    },
    {
      "date": "2021",
      "region": "north of east",
      "profit": 30,
      "sales": 60
    },
    {
      "date": "2022",
      "region": "north of east",
      "profit": 50,
      "sales": 100
    },
    {
      "date": "2023",
      "region": "north of east",
      "profit": 40,
      "sales": 80
    }
  ],
  "measures": [
    {
      "id": "profit",
      "alias": "Lợi nhuận"
    },
    {
      "id": "sales",
      "alias": "Số lượng bán"
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Ngày"
    },
    {
      "id": "region",
      "alias": "Khu vực"
    }
  ]
}

  return <VSeedRender vseed={vseedConfig} />
}

Tự động chọn

import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "date": "2019",
      "region": "east",
      "profit": 10,
      "sales": 20
    },
    {
      "date": "2020",
      "region": "east",
      "profit": 30,
      "sales": 60
    },
    {
      "date": "2021",
      "region": "east",
      "profit": 30,
      "sales": 60
    },
    {
      "date": "2022",
      "region": "east",
      "profit": 50,
      "sales": 100
    },
    {
      "date": "2023",
      "region": "east",
      "profit": 40,
      "sales": 80
    },
    {
      "date": "2019",
      "region": "north of east",
      "profit": 10,
      "sales": 20
    },
    {
      "date": "2020",
      "region": "north of east",
      "profit": 30,
      "sales": 60
    },
    {
      "date": "2021",
      "region": "north of east",
      "profit": 30,
      "sales": 60
    },
    {
      "date": "2022",
      "region": "north of east",
      "profit": 50,
      "sales": 100
    },
    {
      "date": "2023",
      "region": "north of east",
      "profit": 40,
      "sales": 80
    }
  ]
}

  return <VSeedRender vseed={vseedConfig} />
}

#Dataset

#Một chỉ số, một chiều

#Một chỉ số, nhiều chiều

#Một chỉ số, không có chiều

#Nhiều chỉ số, một chiều

#Nhiều chỉ số, nhiều chiều

#Nhiều chỉ số, không có chiều

#Cấu hình chiều dữ liệu và chỉ số

#Tự động chọn

Dataset

Một chỉ số, một chiều

Một chỉ số, nhiều chiều

Một chỉ số, không có chiều

Nhiều chỉ số, một chiều

Nhiều chỉ số, nhiều chiều

Nhiều chỉ số, không có chiều

Cấu hình chiều dữ liệu và chỉ số

Tự động chọn