Skip to content

Instantly share code, notes, and snippets.

@typpo

typpo/gist:a2cfdc95a927b975505e8f3330f0efba

Last active July 9, 2020 23:36
Show Gist options
  • Save typpo/a2cfdc95a927b975505e8f3330f0efba to your computer and use it in GitHub Desktop.
Save typpo/a2cfdc95a927b975505e8f3330f0efba to your computer and use it in GitHub Desktop.
Download ZIP
QuickChart/Chart.js doughnut graph
Raw
gistfile1.txt
Image Example:
https://quickchart.io/chart?bkg=white&c=%7B%20type%3A%20%27doughnut%27%2C%20data%3A%20%7B%20labels%3A%20%5B%27High%27%2C%20%27Medium%27%2C%20%27Low%27%5D%2C%20datasets%3A%20%5B%7B%20data%3A%20%5B11%2C%20110%2C%2060%5D%2C%20backgroundColor%3A%20%5B%27%234e73df%27%2C%20%27%230f3dc4%27%2C%20%27%239fb4f3%27%5D%20%7D%5D%20%7D%2C%20options%3A%20%7B%20legend%3A%20%7B%20position%3A%20%27right%27%2C%20align%3A%20%27start%27%20%7D%2C%20plugins%3A%20%7B%20datalabels%3A%20%7B%20color%3A%20%27%23fff%27%20%7D%2C%20doughnutlabel%3A%20%7B%20labels%3A%20%5B%7B%20text%3A%20%27Donut%27%2C%20font%3A%20%7B%20size%3A%2020%20%7D%20%7D%5D%20%7D%20%7D%20%7D%20%7D
Interactive Example:
https://quickchart.io/sandbox/#{%0A%20%20%20%20type:%20'doughnut',%0A%20%20%20%20data:%20{%0A%20%20%20%20%20%20%20%20labels:%20['High',%20'Medium',%20'Low'],%0A%20%20%20%20%20%20%20%20datasets:%20[{%0A%20%20%20%20%20%20%20%20%20%20%20%20data:%20[11,%20110,%2060],%0A%20%20%20%20%20%20%20%20%20%20%20%20backgroundColor:%20['%234e73df',%20'%230f3dc4',%20'%239fb4f3']%0A%20%20%20%20%20%20%20%20}]%0A%20%20%20%20},%0A%20%20%20%20options:%20{%0A%20%20%20%20%20%20%20%20legend:%20{%0A%20%20%20%20%20%20%20%20%20%20%20%20position:%20'right',%0A%20%20%20%20%20%20%20%20%20%20%20%20align:%20'start'%0A%20%20%20%20%20%20%20%20},%0A%20%20%20%20%20%20%20%20plugins:%20{%0A%20%20%20%20%20%20%20%20%20%20%20%20datalabels:%20{%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20color:%20'%23fff'%0A%20%20%20%20%20%20%20%20%20%20%20%20},%0A%20%20%20%20%20%20%20%20%20%20%20%20doughnutlabel:%20{%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20labels:%20[{%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20text:%20'Donut',%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20font:%20{%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20size:%2020%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20}%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20}]%0A%20%20%20%20%20%20%20%20%20%20%20%20}%0A%20%20%20%20%20%20%20%20}%0A%20%20%20%20}%0A}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment