gazdagergo
commented
8 months ago The grid is based on D3.js library. The D3 generated the rectangles as an SVG image and the titles separately as text and tried to align the two layers with css. The current solution is a proper SVG where the text is physically inside the rectangle plus a title pops up on hover. The line wrap algorithm has been re-implemented and enhanced too (the original one dropped the overflowing text completely). The title always contains the SDG code now.
Acceptance Criteria:
- Visit the https://digitalpublicgoods.net/registry/ page
- scroll down to the colored tiles
- all titles are visible (except the ones inside the very small rectangles, but the popup title on hover give you the information here too)
Data Explorer section in Registry page: Some of the SDG grids don't have titles. Except the SDG 14, which is smallest grid, the rest of them shouldn't have a size issue for having the SDG title in the grid. The smallest tile in the tile map should have big enough size to fit the wrapped title. @gazdagergo @skylark1848