Viewing a saved revision (read-only)
ec18889b0a9b41c0b160541dad1a4a7c
Massachussetts Top 10 Crime City filter works before adjust axis
This interactive visualization displays the top 10 cities in Massachusetts by crime rate, filtered by community type (city, rural, or suburb) through a dropdown menu. Built with React and D3 v5, it renders an SVG bar chart using `scaleBand` and `scaleLinear` to map city names and crime ratios. The bars show tooltips with formatted percentage values, and the y-axis uses `d3.format` for readability. Data comes from a 2016 Massachusetts crime dataset loaded via `d3.csv`. The author notes unresolved issues with axis alignment and label rotation.
AI-generated descriptionA program that shows the top 10 most crime city in massachusetts
I have tried my best to adjust the chart. there are a few things I cannot figure out still.
- adjst the Y axis, so that 0.0% line line with bottom of column. column value appear correct though. wrap my head, not sure why
- tilt the text label so they don't overlap
- I was able to refactor useData.js, but not other module. There is a tick() is not a function error I don't have solution.