Skip to main content

Basic chart

chartOptions 기본적인 차트를 만들 수 있어요.
blocks:
  - type: http
    method: GET
    fetchFn: |
      return [
        { type: 'A', count: 12 },
        { type: 'B', count: 7 },
        { type: 'C', count: 19 }
      ]
    chartOptions:
      type: bar    # line, doughnut, polarArea
      x: type
      y: count
    showButtonWithResult: true

Change background color of chart

backgroundColor
chartOptions:
  type: bar
  x: date
  y: company
  backgroundColor:
    company: "RoyalBlue"

Set multiple y-axis

y축을 2개로 설정할 수 있습니다.
blocks:
  - type: http
    method: GET
    fetchFn: |
      return [
        { date: '2025-10-01', company: 12, user: 30 },
        { date: '2025-10-02', company: 18, user: 22 }
      ]
    chartOptions:
      type: bar
      x: date
      y:
        - company
        - user
y축을 좌우 다른 눈금으로 표기하고 싶은 경우
    chartOptions:
      type: bar
      x: date
      y:
        - company
        - user
      data:
        datasets:
          - yAxisID: company
            backgroundColor: "RoyalBlue"
          - yAxisID: user
            backgroundColor: "#F5F3E7"