This is a demonstartion of how to align arbitrary GeoJSON data to the us-atlas topojson data.
It's important to note that the TopoJSON from
us-atlas has it's map projection,
(d3.geoAlbersUsa), built into it. In other words,
it is considered "projected" geographic data.
This is an important distinction from GeoJSON data which is most typically stored in the unprojected Coordinate Reference System WGS84, also commonly referred to as "lat, lon" (though coordinates are most often stored in the order longitude, latitude).
In order to properly align arbitrary GeoJSON data with us-atlas, we need to properly set the projection's
translate attributes to those used by us-atlas, which can be found in its
var projection = d3.geoAlbersUsa().scale(1280).translate([480, 300]);
This will give us correct SVG x, y coordinates from lon, lat coordinates. For instance:
projection([-122.41, 37.76]) // returns Array [ 34.37093520874129, 257.47410484805755 ]
d3.geoAlbersUsa alone will result in the GeoJSON data being mis-aligned with the map.