DKAN Dash is a module for creating multi-faceted data visualizations based on datasets in DKAN, the Drupal-based open-source open data portal. Fundamentally it is a wrapper around the React Dash library. Some of the features include:
- Charting and Graphing with D3 (via NVD3)
- Choropleth Maps
- User filters to interact with data
- Custom layouts with Bootstrap responsive grid
- Metric and Goal components for visually compelling presentations of simple statistics
- Integration with DKAN datasets and the Drupal content system
- Lots more!
As an example of what you might get from wiring it all up, here is a screenshot from a recent project for the Georgia Board for Physician Workforce:
Changing the filter values at the top will reload the data -- and, in some cases, change the layout -- of the visualizations below them.
Who DKAN Dash is for
We built DKAN Dash as a way to do complex custom data visualization dashboards in a repeatable way using DKAN's Datastore API as a data backend. DKAN Dash and its supporting ecosystem are really a development framework that allows for highly customizable data visualizations while minimizing boilerplate code and unnecessary repetition.
How it Works
Under the hood DKAN Dash consists of a number of major components:
The definitive feature of React Dash is its configuration-based architecture. An entire dashboard can be created using a declarative configuration object (essentially a large JSON file with a well-documented schema).
The modules also provides a browser-based JSON editor to make modifying dashboard configurations easier:
Custom implementation module
The future of DKAN Dash and its underlying libraries is bright. As we continue to roll out dashboard implementations the list of features grows, and the stability and performance of the platform continues to improve. While development at this point is being driven by immediate project requirements, there are some big things brewing:
Under development we have:
- Accordion-style expanding and collapsing of layout regions
- Real-time updates with websockets
i18n and string support
There is currently no easy way to publish multilingual dashboards. A future version will leverage Drupal's string and entity translation systems, and make strings (such as captions, intro text or even chart labels) easier for non-technical users to both modify and translate.
Better documentation and examples
The react-dash library ships with an example project and has a full documentation site. Future releases of DKAN Dash could include a working example in the custom_dash repository or elsewhere, along with more complete documentation for how to implement dashboards in DKAN.
- The React Dash documentation is a complete resource for information on the standalone library.
- Take a look at the files in the custom_dash repo to see how a specific implementation would be structured.
- Look for news and updates on the DKAN blog
- Join the
#dashboardschannel on the DKAN Community Slack
> yarn > npm run dev
The extended workflow includes changes in react-dash library. Sometimes it's useful to work with dkan_dash and react-dash at the same time. For such cases you might want to compile react-dash, copy the files to dkan_dash and then compile dkan_dash. However this is not very straight forward so dkan_dash build grab from the environment variable REACT_DASH_PATH the path to the react-dash library in order to do this process automatically.
> yarn > export REACT_DASH_PATH=/path/to/react/dash > yarn run dev