Giter Site home page Giter Site logo

maljovec / quetzal Goto Github PK

View Code? Open in Web Editor NEW
0.0 0.0 0.0 369 KB

An interactive multiple coordinated view dashboard that runs in the web browser designed for multivariate data.

License: MIT License

Jupyter Notebook 36.71% Python 9.56% JavaScript 51.37% HTML 0.47% CSS 1.88%

quetzal's People

Contributors

maljovec avatar

Watchers

 avatar  avatar

quetzal's Issues

Hovering vs. Filtering

These two modes of data highlight continue to fight each other. It would be useful if the hover feature could be toggled off automatically when filtering data on or between an axis or set of axes, a possibly easier route would be to add a button that allows the user to toggle on and off the hover feature.

Weird Display issue

There is a weird display issue existing on my machine running this app through Ubuntu WSL on Windows. It appears to persist no matter what browser I use:
image

This is a clean checkout of the master branch, and I have cleared my browser cache. I am not sure what the issue is, but my Ubuntu machine displays the same code normally. So, this must either be OS-dependent or my machine is in a weird state. It will be interesting to try to run the server on my Linux box and navigate to it from my laptop and vice versa.

Adding Tooltips for Unlabeled Dimensions

When the labels are hidden on the individual axes, it can be hard to orient oneself to the dimensions provided:

image

I propose to add a tooltip that appears on hovering over an axis that will show its label. Additionally, capturing this event can also be useful for displaying other information such as a 3D rendering of where in the boiler tower the sample was drawn or a histogram of values over that dimension. These items are not part of this issue, but could be follow-ons provided this event can be captured.

Dimensional Histograms

Somehow give the sense of density by providing histogram information. My first thought is to have a histogram view that updates as you hover/mouse over different dimensions. Another option would be to somehow annotate each axes on the parallel coordinate plot, but this seems like it could cause a lot of clutter.

Higher-Level API

Currently, the API for generating a plot is rather cumbersome. It was suggested that I should look into creating an interface that resembles matplotlib. This will cause a fair amount of work to design properly. My suggestion is to look into seaborn as an example since it can readily take in a pandas dataframe or operate directly on data. Given the highly structured nature of the data occurring in these plots, it would be useful to support something like how seaborn uses dataframes.

Jupyter Compatibility

Currently, the d3.parcoords.js library does not play nicely in Jupyter. It would be cool if this could exist as a widget in jupyter and jive with their CSS, so a user could generate a dashboard and interact with it via python code.

Reorderable Charts

It would be a nice feature to be able to allow the user to reorder the stack of charts as they see fit.

New example

Dan,
I have a new example that involves more simulations and sampling of prior & posterior distributions. Also, all my data is encapsulated in one pickle file. It does seem to break the selections. I don't know how you would like me to handle it. I created a separate file (example_sean.py with the pickle file BSF_nonlinear.p) and committed it to my own repo, but don't have permission to push to the remote.
Sean

Adding Button to Add Selections to Every Axis where Bounds Exist

Given the parallel coordinates can now display ranges of data when lists are passed as data elements, it would be useful to allow users with the click of a single button add filters for every axis that match one series of this type. A button should exist for aligning selection boxes to each series that contains axis bounds rather than a single value. In this way, a user could toggle between selecting all data that fits a particular model bounds and an alternative model's bounds.

Collapsible Headings

It would be a nice feature if the user could click on the title of a graph to collapse it allowing more screen space for other plots.

Adding Counts of Filtered and Total number of Items on the UI

A requested feature to orient the user was to add somewhere on the UI the count of items that are currently highlighted by a given filter. I would propose that in addition to that number, we should also give it in context of the total number of elements.

The legend could be a natural fit for this data as we could show how many points are in each series out of a total for that series plus a sum of those two columns to give a view of it in total for all series.

Hover After selection

The hovering after selection appears less pronounced. That is the data that is not being hovered does not render in a semi-transparent fashion which makes it hard to distinguish what is being highlighted.

Whitespace Reduction

Move the "Selection mode" onto the top line or have a universal selection mode for all plots. Otherwise the inclusion of this label and drop-down causes a lot of empty space to the right of these labels that cannot be utilized by the plots.

See yellow area below:
image

3D Plot of the Boiler Tower for Context

This is highly specific to the example at hand, but it might be nice to correlate a highlighted dimension back to the physical model. Here we could parse the dimension labels into X, Y, Z coordinates and add them as a separate 3D scatterplot. Somehow, we would have to link this plot to the hover event on a particular dimension, so that when a dimension is highlighted, this auxiliary view will update. I am trying to figure out how this could be generalizable to other problems... Maybe the dimension label does not have a 3d physical meaning, but then it could be linked to something else. This specific mechanism should not preclude providing the event for consumption by other views.

Remove the Word "Legend"

Remove the word legend from the legend and add a placeholder for grabbing and moving the legend around.

Save to pdf

Of course this tool has the most value in its interactivity. However, I think it is inevitable that someone will want to save a plot in its given state to pdf in order to add to a report.
For now, they have the option to use the browser's export.

Matlab Interface

There is potentially interest for this UI to interface with matlab.

Line Occlusion

There should be the ability to show the data in different representations than parallel coordinates as line occlusion can really limit the transfer of knowledge from a particular plot. I would recommend starting with an individual scatterplot where the axes are customizable by the user. We could default to showing either PCA or some form of MDS to give a sense of how "close" points are to one another, but also allow the user to change the dimensions to axis-aligned projections where they can potentially make more concrete decisions.

With a single scatterplot coded, we could potentially compose the individual axes into a matrix if desired.

Add Axis Label on leftmost Axis for "shared" configuration

When the user configures their data to use a scales = "shared" for a particular plot, then they either have the option to have the tick_labels be "hidden" or "visible." When visible, they should show for the leftmost axis only, since the same data will be shared by all dimensions.

This could be a nontrivial amount of effort, since reordering the dimensions will mean redrawing the labels for the new first axis and removing them from the old one. Also, what should happen in the event that a dimension is reversed?

Adding Button to Clear all Selection Filters

It can be hard to unselect a filter on a particular axes or it could be a time-consuming task if a user selected a bunch and just wants to clear them all. Adding a button that would remove all filters would make life a lot easier.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.