1) How do you join geometries from a TopoJSON file with attributes from a CSV file?
The TopoJSON's geometries and the csv attributes were joined with the FIPS code for each county. This was done in the above command, with the csv d3 command calling the FIPS from the csv and the TopJSON simultaneously. This is what allows for the spatial and demographic data to be displayed within the map above.
Which colors are used for bivariate mapping in Observable?
Explain how to select or construct a bivariate color scheme
This command cell displays the options for colors to be displayed within this notebook. The options are red-blue, blue-purple, green-blue, and purple-orange. The addition of numerous color schemes with the option select ensures that most individuals with vision impairments will be able to understand this map. Each individual color scheme contains the python codes for the nine individual colors that correspond to the color options.
Bivariate color schemes in this map utilize three sequential color schemes. Two separate color schemes are separated by axis, with one color scheme on the x-axis and the other color scheme on the y-axis. A third color scheme that has a combination of hues from both sequential color schemes is present to highlight values of data that are a combination of both variables. While bivariate choropleth maps are displaying the relationship between two variables, the third sequential color scheme provides an extra level of analysis that provides context into the relationship between the variables.
The bivariate legend is created in the command cell above. This is not only where the symbology of the legend is created (in the font/ font size, color fill commands, line symbology/ line color) but where the connection to the data is. The data is called upon within the line with the "d3.range", which takes the data and links it with the extent of the legend itself. This ensures that the high values of data are correlated with the colors in the legend associated with high values as well.
The legend positioning can be manipulated under the line "svg.append(legend)" with the line ".attr("transform","translate(300,460)")". The values associated with translate will move the legend on the x and y axis to wherever the legend needs to be positioned.
Values are displayed when hovering over a polygon from the "append("title")" line. Under this line, the code calls for text to be displayed when hovered over. The command calls for the field titled "NAME" (the individual county names) and the percentages of the normalized data as well. The normalized data is called upon in the latter half of the second command line, which calls for each FIPS (the joined attribute, specifically called upon with "idAttribute") to display the data associated with it.