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

[BUG] Bumpy line on smooth data set #4704

Closed
Diggsey opened this issue Aug 26, 2017 · 1 comment
Closed

[BUG] Bumpy line on smooth data set #4704

Diggsey opened this issue Aug 26, 2017 · 1 comment

Comments

@Diggsey
Copy link

Diggsey commented Aug 26, 2017

Expected Behavior

The line should be smooth.

Current Behavior

The line is bumpy.

Possible Solution

Avoid rounding to pixel coordinates before drawing lines.

Steps to Reproduce (for bugs)

https://codepen.io/anon/pen/gxdzjb

@jcopperfield
Copy link
Contributor

Like mentioned as a Possible Solution it suffices to replace the return Math.round(pixel) with return pixel in the function getPixelForValue in the file scale.linear.js.
It only causes two minor side effects in the test-suite.

Two values checked in the file core.controller.tests.js (on lines: 762 and 763)

-    expect(meta.data[0]._model.y).toBe(333);
-    expect(meta.data[1]._model.y).toBe(183);
+    expect(meta.data[0]._model.y).toBeCloseToPixel(333);
+    expect(meta.data[1]._model.y).toBeCloseToPixel(183);

and one in the file core.tooltip.tests.js (on line: 806)

// mouse event won't fire as it always rounds to the whole nearest pixel
-    clientY: rect.top + firstPoint._model.y
+    clientY: rect.top + Math.ceil(firstPoint._model.y)

issue_4704

jcopperfield added a commit to jcopperfield/Chart.js that referenced this issue Nov 13, 2017
 - Bumpy line on smooth data set.
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

4 participants