# 일자별 쿼리로 지표 그래프 그리기 (증감률, 퍼센트 표시)

**URL:** <https://ask.selectfromuser.com/t/topic/41>\
**Category:** 사용 팁\
**Tags:** chart\
**Created:** [6월 28, 2023, 10:05오전 UTC](https://ask.selectfromuser.com/t/topic/41 "2023-06-28T10:05:22Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![jhlee](https://yyz2.discourse-cdn.com/flex032/user_avatar/ask.selectfromuser.com/jhlee/32/20_2.png) [@jhlee](https://ask.selectfromuser.com/u/jhlee)\
**Post date:** [6월 28, 2023, 10:05오전 UTC](https://ask.selectfromuser.com/t/topic/41/1 "2023-06-28T10:05:22Z")

</div>

일자별 지표 쿼리를 월/주/일로 샘플링하여 표시합니다.

```auto
- type: query
  resource: mysql.qa
  name: bar percentage diff 
  sql: > 
    SELECT DATE_FORMAT(created_at, '%Y-%m-%d') as 'date', COUNT(id) as c, COUNT(user_id) as users
    FROM UserStageLog
    WHERE created_at BETWEEN :date1 AND :date2
    GROUP BY DATE_FORMAT(created_at, '%Y-%m-%d')
  chartOptions:
    type: bar
    x: date
    backgroundColor:
      c: "RoyalBlue"
      users: "Tomato"
    borderWidth:
      c: 0
      users: 0
    y: 
      - c
      - users

    gap: true
    interval: month
    daily: false
    weekly: false
    monthly: true

    sampleBy: sum
    options:
      layout: 
        padding: 50
      plugins:
        datalabels:
          anchor: end
          align: end
          offset: 4
          formatter: percentage-diff

```

 ![Screenshot 2023-06-22 at 3.24.38 PM](https://canada1.discourse-cdn.com/flex032/uploads/selectfromuser/original/1X/d68879fd63f2ca440d84d8424a90450b7c498204.png)

그래프가 많은 경우 레이블을 기울이기

```auto
options:
  layout: 
    padding: 50
  plugins:
    datalabels:
      anchor: end
      align: end
      offset: 4
      formatter: percentage-diff
      color: RoyalBlue
      rotation: -45
      font: 
        size: 10
        weight: bold

```

 ![Screenshot 2023-06-22 at 3.26.14 PM](https://canada1.discourse-cdn.com/flex032/uploads/selectfromuser/original/1X/2063e0059e14c2feae11fafe95c9cb3fb233aa75.png)