Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[p5.js 2.0 Beta Bug Report]: endShape(CLOSE) for splineVertex has backwards tangent #7494

Closed
1 of 17 tasks
davepagurek opened this issue Jan 24, 2025 · 0 comments
Closed
1 of 17 tasks

Comments

@davepagurek
Copy link
Contributor

Most appropriate sub-area of p5.js?

  • Accessibility
  • Color
  • Core/Environment/Rendering
  • Data
  • DOM
  • Events
  • Image
  • IO
  • Math
  • Typography
  • Utilities
  • WebGL
  • Build process
  • Unit testing
  • Internationalization
  • Friendly errors
  • Other (specify if possible)

p5.js version

2.0 beta 1

Web browser and version

Firefox

Operating system

MacOS

Steps to reproduce this

This snippet should create a rounded triangle

function setup() {
  createCanvas(100, 100);
}

function draw() {
  background(220);
  scale(2)
  beginShape();
  splineVertex(10, 10);
  splineVertex(15, 40);
  splineVertex(40, 35);
  endShape(CLOSE);
}

Live: https://editor.p5js.org/davepagurek/sketches/QGv88_YLf

Instead, it has a backwards loop where it loops back on itself:

Image

It should ideally look like this (rendered using 1.x by repeating the first 3 points):

function setup() {
  createCanvas(100, 100);
}

function draw() {
  background(220);
  scale(2)
  beginShape();
  curveVertex(10, 10);
  curveVertex(15, 40);
  curveVertex(40, 35);
  
  curveVertex(10, 10);
  curveVertex(15, 40);
  curveVertex(40, 35);
  endShape();
}

Live: https://editor.p5js.org/davepagurek/sketches/1JgK9Qvm-

Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant