Git Product home page Git Product logo

dcaction's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

dcaction's Issues

Clear schools

Give some option to clear selected school data entirely.

0 vs. 0% vs. n/a on map

Make sure when a value is blank, the map shows the neighborhood in gray, not as the lowest value of green. Also, in non-% variables, make sure the value displays as 0, not 0%.

Create the hooks necessary for query UI to highlight points based on text input, neighborhood, ward, or grade

The intended function of the visualization-wide query tool is detailed in the bubble storyboard:
bubble-interface
We need to make sure that we're exposing the right variables in the D3 graphic that will allow inputs on this query widget to highlight the corresponding points.

Ideally, matched points would be highlighted as the user narrows their query. Unmatched points would still appear on the map, although they would be grayed out or translucent.

Blank out health data for n<30

For the health data sets (those coming from medicaid) where neighborhood estimates are less than 30, those need to display as blank - this was a data request from the agency supplying the information.

Convert the navigation to a layer select UI

Instead of dropdown menus, we'd like the navigation UI to function in a way that allows users to select multiple visualization layers to mix and match data. The visualization would allow users to plot a choropleth layer and a point-based layer (either schools or child care centers). Right now the nav is simple links but ideally this navigation would function in a way similar to radio buttons.

Fix number display for data points in sidebar

Right now, selecting neighborhoods will display data from our CSV but it is not adding commas to figures in the thousands or correcting percentages to display as percentages and not decimals. For these relevant data points, we'd like to transform the display of these numerals.

Integrate school and neighborhood info cards with visualization layers

Right now, we only have basic information for school points popping up in the sidebar. It's possible to display multiple information from schools, but this information has not been styled and all requested data does not display.

We'd like for the sidebar to populate with data from the neighborhood shapes and school/child care center points. The data reflected should appear similar to the school and neighborhood storyboards.
map-interface
budget-interface

Hide #schools box until a point is selected

I added a new UI element to receive school data instead of the details box. It would be great if this box remained hidden until a user selects one of the schools on the schools layer. I referenced this issue in #32.

Add charter school data as a point layer

We would like to add a layer (similar to the public school layer, it would need to behave as is described in issue #39)

I will provide a CSV file for this in the data folder, it will be named charter.csv and will be structured the same way as the public school point layer.

Fix duplicate school display.

Clicking on a school always adds a new info box to the page.

Not sure if the best behavior is to only ever have one displayed, or only ever have one for a single school displayed? Maybe limit it to X amount at a time?

Check Child Poverty

Child poverty numbers being pulled from the census look way off - need to retrace steps.

Display neighborhood name and data on hover

Right now data and neighborhood names will only appear on click. We need the neighborhood names and data to appear on hover as well. The difference between hover and click should be that, when clicked, the hover interaction will cease and the graphic will zoom to the selected neighborhood. Clicking again will zoom out and resume the hover interaction.

Add Leaflet background to D3 visualization

Right now we have our polygons floating on white with not roads or landmarks to provide guidance for users of what they are clicking on. Adding a tile layer backdrop for our translucent polygons to float over will provide more context for each neighborhood.

Peter suggests doing something like this:

http://bost.ocks.org/mike/leaflet/

This would give nice mapping in the background, which could be nice.

We could use Open Street Map as a backdrop.

Clear menu when neighborhood is rolled upon or selected

Right now, when a layer is selected and the user begins to explore the neighborhood information, it's not possible to see the sidebar information that displays data values.

On rollover or click, it would be nice if the menu of layers would slide back left to leave an unobstructed view of the whole graphic.

Allow charter school and public school data to appear together on the same map (using the packMetros method)

We'd like the logic of the point layers to work a bit differently than the choropleth layers. Whereas choropleth layers cannot be placed on the map together (only one at a time), we'd like the public and charter school points to appear on the map together, if the user chooses.

Right now we have a function applied to the public schools that allows each circle to clear it's immediate area and "push" schools out of the way so it is easy to distinguish between points in an area where schools are clustered.

Obviously, adding charter schools to the map will greatly clutter it, so we'd like the same function applied when this layer is added. Ideally, both of these layers will push eachother out of the way so you don't have any public school or charter school points on top of one another.

We adapted the packMetros method from one of the D3 examples listed on Mike Bostock's site: http://trends.truliablog.com/vis/metro-movers/

Fix display of filters in flyout

Right now, it runs longer than the browser height. Ideally, the flyout would have an overflow-y scroll and have a height sized to the browser.

Also open to using a dropdown if interested, but this seems more UX friendly across devices, IMO.

Populate data to school-point layers

For the schools, the points we’d want to display on click are grades served as of 12-13, total enrollment, DC CAS reading and math proficiency rates, and graduation rates if applicable.

Zoom out to full view of DC, or just add zoom buttons

Currently, if you click outside of the DC boundaries in a zoomed-in view, it zooms back out. It would make more sense to have a button or "zoom out to DC" icon that is a more explicit indication of how to view all of DC.

Create infocard interaction for point-based visualization

While the 1.0 e-Databook populated the sidebar with information for neighborhoods as the user rolled over, we'd like the sidebar information for point based data to allow multiple schools/child care centers to be compared.

When the user rolls over the points, it will populate the sidebar with information about that school or child care center. However, if they click, they will collect info cards from multiple points, however many they click, so they may compare multiple schools.

This interaction is partly working on the D3 skeleton now, although not all data points are being called into the infocards and the design is not especially elegant.

Integrate neighborhood layer switching into main JS file

Right now there are two JS files with code we've worked on. One for the point interactions Aaron was working on and another with work me and Emily did on Oct. 27. Shouldn't be too hard to bring these together, but in case I stepped on any toes I kept them separate. Just need someone to bring them together once things are working right.

Create the #bubble visualization toggle detailed in the bubble interface storyboard.

Similar to the #graph interface issue, pulling this off centers around finding a competent way to convert the lat/long geographic plotting transformation into a collection of bubbles sorted by relative size. We'd like a visualization similar to other popular D3 graphics, such as the NYTimes 2013 Obama budget graphic (http://www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html). See the attached image from the storyboard for an idea of what we'd like this to look like:
bubble-interface

Verify Census Data Pull

We are pulling tract level data from the Census API and crosswalking it from tracts to clusters. The data pulling script or crosswalking program could be wrong.

To verify the data is correct, we should add all of the clusters back together and compare the results from a not crosswalked dataset.

I can perform this verification, I just need the clusters summed up and put into a dataset.

Create legends

We need to forward the breakpoints expressed in the visualization.js file to this legend box. Ideally, where breakpoints are percentages, we need to have the legend box expressing them as such. Below is an example of how the code lists these breakpoints:

'math' : {
'domain' : [0.14, 0.355, 0.54, 0.75],
'range' : ["#e5ffc7", "#d9fcb9", "#bbef8e", "#9ad363", "#6eb43f"]
},

The legend in this instance would read like:

0-14%
14%-35.5%
35.5%-54%
54%-75%
75% and up

Bring hovered neighborhood to front

Right now, the active state of the hover shows a black border, but it gets cut off if the path is below other paths. Ideally bring that path up to the top with z-index or d3 equivalent.

Clean up choropleth layer swapping code

dc.html provides for basic layer switching for DC choropleth maps, but the code needs to be simplified. There needs to be an array that defines each layer and threshold. The map needs to toggle between these maps based on a key term to identify each layer.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.