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

Can scatter plot achieve the shape of scatter points? #913

Open
haibins opened this issue Jan 16, 2024 · 1 comment
Open

Can scatter plot achieve the shape of scatter points? #913

haibins opened this issue Jan 16, 2024 · 1 comment

Comments

@haibins
Copy link

haibins commented Jan 16, 2024

I am trying to implement scatter plots with shapes other than circles, such as rhombuses, hexagons, etc., and connect the points with lines. Is there any such demo? This feature is important because the data I use has a lot of duplicate x data , thanks

@leeoniya
Copy link
Owner

i think it would be cool to add these to the scatter demo. you'd have to make a new pathBuilder that accepts a shape string as an option or something. internally, a diamond can be drawn like this:

let halfDiagMult = Math.sqrt(2) / 2;

function drawMark(ctx, x, y, size = 10) {
  let halfDiag = size * halfDiagMult;

  ctx.beginPath();
  ctx.moveTo(x - halfDiag, y);
  ctx.lineTo(x, y - halfDiag);
  ctx.lineTo(x + halfDiag, y);
  ctx.lineTo(x, y + halfDiag);
  ctx.fill();
}

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

No branches or pull requests

2 participants