Detect and apply restriction to objects/ paths using Intersection library
All,
Further to my post here,
@Phrogz suggested we look into Kevin Lindsey's library for our needs of identifying the borders and applying restrictions. Has anyone got any experience of using this library?
THE PROBLEM: In our web application we have an object made of SVG paths. We are trying to implement the functionality of drag and drop of other objects inside this object, with restrictions needing to be in place that the objects cannot be dropped outside the this SVG object.
Upon Phrogz recommendation, we looked into this but are struggling to make sense of how to pass the object. Do we pass the objects as path string or as SVG object.
ERROR: At this moment, we are not g开发者_JAVA技巧etting any output, not even sure if its accepting the objects we pass through.
This is quite an open question and Im particularly keen on hearing from individuals who might know a thing or two about Kevin's library/ how it works/ functionality.
Cheers
I'm not sure how performant this will be for you. I wrote this library more as a proof-of-concept and to educate myself on intersections for higher order curves. That being said, I assume you are trying to instantiate instances of Path from the library? If so, have a look at loadShapes from the the following utility:
https://github.com/thelonious/js-intersections/blob/master/samples/IntersectionUtilities.js
That gets called on start when processing, say, this file:
https://github.com/thelonious/js-intersections/blob/master/samples/intersect_bezier3_rect.svg
Note that I'm tagging items to be process with a custom gui:edit attribute. That's neat and all, but I wrote this many many years ago (8+) and I'm sure the state of the art has better techniques, but I digress. The main thing is that you need to instantiate each shape type using the class for its node type. Each time you want to check for an intersection, you'll need to call Intersection.intersectShapes(node1, node2). That will return an object with a status attribute which will let you know if there was an intersection or note. I'm sure all of this can be improved. The code is up on github for those who wish to fork, fix, and improve :)
https://github.com/thelonious/js-intersections https://github.com/thelonious/svg-2d
HTH, Kevin
精彩评论