Notice:
This module is experiencing issues with the latest version of D3 (V5). I plan to rewrite it to work with the latest version though given D7 deprecation approaching it might make sense to write this as a D8 solution instead.
The D3Map Views module was created to take content output by a view which contains a state field and allow the content to highlight specific states that have content and makes those states clickable to allow them to filter Views content that is being displayed on the page.
This module is fully code documented and can be enhanced in various ways. Specifically, it can be used to filter any content as long as that content has a state field it can use to determine state allocation of content. It is also fully theme-able so the display and colors can be altered if desired.
I created this because I wanted to allow data to be filtered by clicking on corresponding shape regions (in this case states) and wanted a D3 solution to display the SVG map file as it is highly documented and used. My intention was to not make the code dependent on a US shape SVG file only. The module itself is able to be used with any file but due to my current D3 JS code, it will need to be altered in the future to fully realize this.
More Technical Notes:
- This module creates a new views display that can be used to render the content of a view
- The map display is using D3 to build an SVG representation of a GeoJSON map file of the US
- Custom territories are added to the map for their representation as well as smaller state areas on the east coast (D3 manipulation)
- This is intended to be added to a page which already contains the desired view of the content and that has a state field that uses "state" as the URL variable to represent the state to filter the content by
- There is a hook built in place to translate non-zip code value fields into zip code fields so that the D3 map can make the association between the desired state field and an actual state on the map
- Clicking a state generates a page click that changes the "state" value in the URL to the desired state representation value of the selected state
Performance Note:
The view that provides data for the map can be query heavy depending on how much data it is searching to find every state that is used. To aid this in the view under Other->Caching enable Time-based caching and set it to a high enough time so it doesn't have to query too often.
Project information
- 7 sites report using this module
- Created by kholloway on , updated
- Stable releases for this project are covered by the security advisory policy.
Look for the shield icon below.
Releases
Development version: 7.x-1.x-dev updated 27 Jul 2017 at 18:39 UTC