Quick and Easy Ways to Jumpstart Your Charts

Quick and Easy Ways to Jumpstart Your Charts

Are there any activities that you want to chart over time? Perhaps you want to figure out what time of day you listen to the most music, or when you take the fewest steps per hour. This information can help you optimize your life and share information with other people. Bonus: the charts can look really cool, too! A chart showing activities-per-hour (or per day, or per month) can deliver a ton of information in a compact, easily-understood format.
There are several tools available to help you create a chart like this. With a little JavaScript knowledge, you can make a chart to visualize actions-per-hour in no time!
The first option is to use the JavaScript library D3. In this example, a developer used the D3 library to make a chart in which the area of a slice is larger when there's a larger corresponding value. The disadvantage of using D3 is that there is no handy template to create this sort of chart. The next two choices do have templates available.
Option 2 is to use Highcharts, a charting API. It's very user-friendly and well-documented. Check out the variable radius pie chart! You can tweak this to meet your needs using JSFiddle. For example, this user created a wind rose.
Yet another option is to use Chart.js, an open source JavaScript chart maker. Here's a page on polar area charts, describing exactly what you need to do to create a time-tracking chart.
Your choice of tool will depend on what JavaScript tools you're already using--whatever you're familiar with will be better than whatever is "optimal." If you've never used any of the tools above, start with Highcharts. It has the best documentation, and a helpful user community that can assist you with ironing out bugs in your chart implementation. For more information click here https://imgur.com/a/MROHdr5.

Javascript D3 Web Development