dozed12 / p5.voronoi Goto Github PK

Is it possible in the current library to change (eg. through mouseDragged()) the centroids of the cells? I have tried by accessing the sites using the diagram (voronoiGetDiagram()) but it does not work (plus I am guessing the diagram is readonly).

Thank you for making this library!

Currently, the user can set the width and height of the diagram, forming a rectangular frame that acts as the outer boundary. I'm looking to use a Perlin Noise Loop (or any non-rectangular shape) to act as this outer boundary instead. Do you have any insights into how to bound your diagram in that fashion? This feature may not have justification to be added to the base library.

Hello @Dozed12 !

Like kitchensjn on this issue : #3, I wanted to make voronoi with others shapes than a rectangle.

I tried to follow your advice by using mask() (with the mask being a circle). However with voronoiDraw nothing happens like in the picture below whereas with a rectangle we see that the mask is applied.

Do you have an idea about what could be the problem ?

Thanks and have a nice day !

Duaran

//////////////////////////

With voronoi as "image" and circle "mask":

With rectangle as "image" and circle "mask" :

You can find my code below :

let masks;
let imgs;
function setup() {

	createCanvas(800, 800);
	noSmooth();

	//Settings for drawing(these are the default values)

	//Set Cell Stroke Weight
	voronoiCellStrokeWeight(1);
	//Set Site Stroke Weight
	voronoiSiteStrokeWeight(3);
	//Set Cell Stroke
	voronoiCellStroke(0);
	//Set Site Stroke
	voronoiSiteStroke(0);
	//Set flag to draw Site
	voronoiSiteFlag(true);

    noLoop()

    imgs = createGraphics(width, height);   
	masks = createGraphics(width, height);
}

function draw(){
	
    // for(let site=0;site<=10;site++){
    //     let result = random_inside_circle_voronoid(width/2,width/2,100);
    //     imgs.voronoiSite(result[0],result[1]);
        
    // }
    // imgs.voronoi(width, height, false);
    // imgs.voronoiDraw(0,0, false, false);

    imgs.fill(120,50,80);
    imgs.rect(width/2,width/2,400,400);

    masks.translate(width/2,width/2);
    masks.stroke(1);
    masks.fill(120,50,80);
    masks.ellipse(0,0,300,300);


    let imgClone = imgs.get();
    imgClone.mask(masks.get());
    image(imgClone,0,0);

}

function random_inside_circle_voronoid(Xcenter,Ycenter,r){
    let result = r * sqrt(random(1))
    let theta = random() * 2 * PI
  
    x = Xcenter + result * cos(theta)
    y = Ycenter + result * sin(theta)
    return [x,y]
  }

Suggestion for a function.

Returns a random point within the cell given the cell ID.

Doable?

Is there any way to access the cell color based on cell id?

I'm doing a project where I overlay a diagram on a map to show the location of the nearest hospital in an area. Unfortunately, the mapped area is not very rectangular, so the diagram has very large cells around the edges that go into surrounding areas. Is there an elegant way to create a border on the voronoi diagram that more nearly matches the borders of the mapped area?