WebSVG / voronoi

Parametric Voronoi generator with real time editing and SVG export
https://voronoi-editor.web.app
171 stars 26 forks source link

Add offset from shape edges #27

Open yves-chevallier opened 1 year ago

yves-chevallier commented 1 year ago

My goal is to get any shape with holes and generate a Voronoi diagram inside it. With the app I generated a mesh then modified it in Illustrator to get this result:

image

Then I imported the DXF to Fusion:

image

It would be nice to add such features that generate such DXF

wassfila commented 1 year ago

Looks amazing what you've done. So it's not clear to me what could you achieve with the "Voronoi Editor webapp" and what you had to pre/post process outside the webapp. The Webapp supports sampling alignment of seeds to avoid a certain path see https://github.com/WebSVG/voronoi#the-nicer-way a possible configuration is as follows image example with https://github.com/WebSVG/voronoi/blob/master/data/giraffe.svg

image

Now in your post there's reference to two things :

So for the first point, if you have a reference SVG, you could share it by attaching it to this Issue, it does not have to be your productive shave, but any other shape shat can reproduce the intended function and I can have a look how it could work.

yves-chevallier commented 1 year ago

IMHO The Voronoi webapp has three missing features:

  1. Support of complex shapes (with multiple SVG paths), for example a circle inside a circle.
  2. Allowing to "cut" cells at a specified "offset" from the path.
  3. Generate cells with a minimum radius (allowing milling with a tool with a known radius).

So in my example I generated the SVG from the web app, then apply the following changes in Illustrator/Inkscape:

  1. Add an offset of my shape on the top of the SVG
  2. Pathfinder/Divide to "cut" the shapes from this shape
  3. Manually remove all cells outside the shape
  4. Join all lines in a single shape

Then I was able to export the drawing in DXF and import it in Fusion 360.

From your remarks, converting SVG to DXF could be done with any online converter or good vector drawing software. This could be a nice to have feature, but not mandatory. Working with SVG is a smart and simple solution.

Alternatively for multiple shapes SVG, it could be nice to "display" other paths on the app for information only. The user could manually add cells at specific location to avoid the holes. But the algorithm doesn't need to take care of these shapes.

By the way, I had to manually edit the SVG exported from illustrator to bring the path at the top level.

wassfila commented 1 year ago

Thanks for the feedback, given this repo being my most successful so far, don't forget to star it by the way ;) , I think it's worth considering enhancements.

manually removing outside cells, I think that's performed with Display/in_cells instead of all

when it comes to complex shapes support, I suggest you give "Map" function a try and not "Shape". Given the non importance of input map being in pixels, you can use any image and not limited to svg. You can even use gradients, but for complex multi path and holes, just a black and white image should do, I'll try some examples, and if not already the case, I can forbid the sampler from touching some color limits so they act as absolute avoidance and not probabilistic.

Also, the ui is reaching its complexity limit, and I learned more web tricks in the meanwhile, so that could be refactored to allow scaling in functions.

wassfila commented 1 year ago

I tried with these Maps but could not get anything meaningful, I think the sampling condition is soft and so far it is still necessary to combine both Map and Shape to have the desired effects. If you have examples of reference "comlpex" SVG shapes I can try with you can post them here. image