nickspeal / net-zero

An app that helps you track towards Net-Zero carbon footprint
http://www.speal.ca/net-zero
0 stars 0 forks source link

Improve Weekly Mileage Chart #2

Open nickspeal opened 6 years ago

nickspeal commented 6 years ago

It looks sorta OK now with ~3 months of data, but gets crazy if you have a multiple years worth:

screen shot 2018-06-06 at 11 39 44 pm

We should build functionality to limit the x-axis domain so that you can "zoom in" and not look at many years worth of data at once. I'm imagining you might want to see "All Time", "Past Year", or "Past 3 months", which would just change the start date of the counting algorithm in the HistoryViz component. (Be sure to handle the edge case of the start date being before the start of the data)

After using it and thinking of it a bit I actually think the 1-week period might be enough, but it'd also be worth building a toggle to change the period to monthly in case that view is interesting too. Yearly won't make sense for at least a year and daily is too short to matter.

The visual style of the chart could be greatly improved and there is a whole world of highcharts options worth exploring to make the chart seem even cooler.

andreas-groos commented 6 years ago

If you want 'zoom in' functionality without much coding look into Highcharts/stockchart. https://www.highcharts.com/stock/demo/column. Easy to configure and has '1m','3m' ,'6m' etc.