Giter Club home page Giter Club logo

Comments (10)

adamdburton avatar adamdburton commented on May 11, 2024

I'd love this to happen. I'm going to look into tying mouse event into backbone events (never used backbone before) myself anyway though.

from two.js.

bbn avatar bbn commented on May 11, 2024

+1 for mouse and touch events. at different levels- two-level, polygon-level, vertex-level

from two.js.

jonobr1 avatar jonobr1 commented on May 11, 2024

Thanks for you all voicing your suggestions. It helps me prioritize what I should work on.

Until I'm able to implement something like this there are a few options:

  • The SVG Renderer creates actual nodes in the dom tree. They each have an id attribute that corresponds with its two id attribute. You can bind normal dom svents to this node. See below for usage.
  • Every group and polygon has a method getBoundingClientRect which can help you do hit testing.
var rect = two.makeRectangle(x, y, w, h);
rect.domElement = document.querySelector('#two-' + rect.id);
rect.domElement.addEventListener('click', doSomething);

I'm writing this on my phone, apologies for mistakes. I'll clean it up when I get to a computer.

from two.js.

jankeesvw avatar jankeesvw commented on May 11, 2024

@jonobr1 using SVG with click events sounds like a perfect workaround for now! I can live with that..

It would be a good idea to make a proof of concept and link to the prototype from the documentation..

from two.js.

jonobr1 avatar jonobr1 commented on May 11, 2024

Yep, @jankeesvw: http://jonobr1.github.io/two.js/examples/svg-events.html

from two.js.

jankeesvw avatar jankeesvw commented on May 11, 2024

@jonobr1 nice work! I think we can close this ticket!

from two.js.

jonobr1 avatar jonobr1 commented on May 11, 2024

👍

from two.js.

jonobr1 avatar jonobr1 commented on May 11, 2024

As for handling events @bbn, I wonder if this is out-of-scope for the project. Hear me out before you shoot it down. I recently found toolkitchen/PointerEvents which looks like one great way to polyfill for handling mouse + touch events in a canonical way. However, it's not the only way. The inception of touch events has brought on a number of different styles to treat user input in the browser.

This in addition to other people discussing about using the rendering system outside of the browser's context where there are different user inputs makes me think that the library shouldn't force a style onto the developer. I do think exposing hit testing compatible with all renderers would help facilitate a developers effort in user input interaction.

from two.js.

bbn avatar bbn commented on May 11, 2024

Understood @jonobr1 . I guess what might be helpful would be a companion adapter for the web that would automagically glue the plumbing together. Thanks for pointing me to https://github.com/toolkitchen/PointerEvents (ha)

from two.js.

jonobr1 avatar jonobr1 commented on May 11, 2024

yep, no problem! Coincidentally someone else has already started implementing mouse events into two.js: #17

from two.js.

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.