Git Product home page Git Product logo

Comments (4)

bmschmidt avatar bmschmidt commented on June 12, 2024 1

Just thinking this through a little more, I would imagine that the following workflow would make sense for these applications.

  1. Click a UI component that drops a new div on top of the scatterplot to capture click events. (Not deepscatter's job).
  2. Drag or lasso to create a rectangle or polygon of coordinates in pixelspace. (Not deepscatter's job.)
  3. Turn that set of coordinates into a format that deepscatter is willing to read. (The most likely options would be a rectangle of {x: [min, max], y: [min, max]} for rects, and either geojson or just svg for polygons).
  4. Define two methods on deepscatter.

plot.points_in_area(shape) or something could return probably an iterator over points in the area. This would only include points in tiles that are currently loaded from the server, which in some cases might be a bit of a gotcha.
plot.add_name_for_selection(shape, name) could add a new arrow column to all tiles (including not yet loaded tiles) that was 1 or zero depending on membership in the area. This could then be used as an aesthetic to make points in the area smaller, bigger, more opaque, red, etc.

from deepscatter.

bstadt avatar bstadt commented on June 12, 2024 1

@lanesawyer As @bmschmidt mentions, I've been looking at a lasso implementation that includes coloring the selected points on the plot. I'd love to learn a bit more about your use case and see if its supported under the work my team and I are doing right now. You can ping me on the deepscatter slack or at [email protected]

from deepscatter.

bmschmidt avatar bmschmidt commented on June 12, 2024

I'm interested in this, and it fits into the medium term plans.

There are two things to think about, and I'm open to input about your use case. One is what you want to do with the points once selected--is it to change their appearance in the plot, or is it to pull the data back out of deepscatter? The other is how you want to create the bounding box.

Full on UI/UX work is something I don't think I'm very good at, so I'm trying to avoid incorporating too much of it into the core library. But I'd be open to adding handlers for drag events similar to the existing handlers for click and mouseover events, although it would require a tiny bit of thinking to merge with the existing drag-to-zoom behavior. Alternatively anyone could override the onclick/ondrag events themselves using the DOM. With that, you could define a region of interest in the dataspace using the inverse scales.

With a region defined, you can get into the data. Rectangular or circular bounding boxes are something that I would like to see, and which the quadtree design would definitely facilitate in a static-site setting. The approach (which I would not suggest anyone work on until #31 is merged) would be map a function against all the tiles in a dataset. If the tile is outside the selected region, you can avoid checking the points in it entirely; if the tile is in the selected region, you could check if it fits into the bounding box (probably applying other live filters as well). If it's just generate some output information about all the selected points, I think that is almost supported right now; if it's to re-incorporate the circled region back into the plot, it would take a little while but fit into my medium-term plans for supplementing data in real time.

I also know that @bstadt has been talking about a lasso tool that would do more than this.

from deepscatter.

lanesawyer avatar lanesawyer commented on June 12, 2024

I appreciate another quick response!

Our use-case would include both. We hope to change the appearance of the plot (something like reducing the opacity of the non-selected points, strengthening the colors/size of the selected, or drawing the lasso bounds and filling it with an opaque color) and send the data of what points were selected out of deepscatter in order to update other UI components we have (like showing a different set of data on a table).

I really like the idea of handlers that can be hooked into in order to provide third-party UI components access to what's happening in the plot. Ways to override and/or modify other DOM events would be fantastic too.

And I agree that not incorporating too much UI into the tool would be a good way to go. Other tools we have been evaluating can sometimes be too opinionated on the UI and it's ugly and hard to get rid of without compromising the entire tool.

from deepscatter.

Related Issues (20)

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.