isamplesorg / isamples_webui

Web interface to iSB and iSC APIs

Home Page:https://isamplesorg.github.io/isamples_webui/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Add histogram to collection date slider

datadavev opened this issue · comments

It would be really helpful to see a histogram of the number of matching records above the Collection Date slider. Something like this for example:

image

sghall/react-compound-slider#85 (not specifically suggesting that component, it is just a picture of what I am thinking of).

To start with, this could be a histogram for all records regardless of the current query.

An enhancement would be to display a histogram for the current query (possibly excluding the selected date range query). So for example, if a facet was selected, the histogram would be updated with the dates of the current matching records.

This and this repository both provide a histogram with a slider, but it seems that these does not emphasize the selected range by coloring the histogram of that portion.
Screen Shot 2023-01-23 at 11 36 47 AM

As we already have a range slider in our solr-faceted-search-react, we could also try to add upon this by integrating a histogram. There are few libraries such as react-chart-js2 or Recharts that supports vertical bar charts that we could customize to create a histogram.