Electric Bar Chart Before Stack Refactoring
This bar chart visualizes personal electricity consumption across two years, with bars colored by account number to distinguish usage among three household accounts. Rendered in SVG with D3 v6, the visualization uses `scaleBand`, `scaleLinear`, and `scaleOrdinal` to position and color the bars, with hover interactions transitioning fills to grey. Data is loaded via D3’s `csv` from a GitHub gist, and axis labels, a title, and a legend are generated using `axisLeft`, `axisBottom`, and custom text elements.
AI-generated descriptionA bar chart visualization of my personal electricity consumption dataset. I live in a three family structure and occupy two floors. There is also a common account that supplies the front and back hall lighting as well as the basement and exterrior outlets. It covers a period of two years.
I forked https://vizhub.com/RED98310/a3ea8fbec4b64423a7797a418de4af57?edit=files and stated with that code.
I made the following changes from the one last week
- Change the y axis label to be along the axis and vertical instead of horizontal and at the top to make room for the title.
- Chnaged the colors to green and blue. I thought they were less jarring.
- Change the hover over color from yellow to grey. The yellow was not showing well against the white background.
- Changed the bar colors from green and red to green and blue. I thought the red was somewhat jarring and had more luminance than the blue.
Unfortunately, I deleted the graph that I started with as part of cleaning up my profile then realized I should have kept it and forked from it per the instructions of the assignmnet. I believe I have captured all the changes.
This is the chart before I changed it to use d3.stack
version 1.2