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

WebGL / Improve line antialiasing #15554

Merged
merged 3 commits into from
Feb 14, 2024

Conversation

jahow
Copy link
Contributor

@jahow jahow commented Feb 14, 2024

Antialiasing is now done on the +0.5 -0.5 range; previously it was done on the +0 -1 range, which meant line width was always 1px less that expected.

Before (line of 1px width):
image

After:
image

This PR also contains a workaround for the webgl fill and line patterns that sometimes fail because the images might not be ready for rendering.

Copy link

📦 Preview the website for this branch here: https://deploy-preview-15554--ol-site.netlify.app/.

@jahow jahow force-pushed the webgl-fix-line-antialiasing branch 2 times, most recently from a820f78 to a1c8452 Compare February 14, 2024 11:25
Copy link
Member

@ahocevar ahocevar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, @jahow! You may want to consider my comment regarding renderSync() vs. rendercomplete event. Looks good otherwise.

Comment on lines 107 to 110
requestAnimationFrame(() => {
map.renderSync();
render({
message: 'renders four polygons with various pattern fills',
});
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm wondering if it wouldn't be better to do something like this instead:

map.once('rendercomplete', () => {
  render({
    message: 'renders four polygons with various pattern fills',
  });
});

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Amended the first commit with this change

@jahow jahow force-pushed the webgl-fix-line-antialiasing branch from a1c8452 to f30e34f Compare February 14, 2024 12:02
This makes sure that icons are loaded before rendering
Antialiasing is now done on the +0.5 -0.5 range; previously it was done on the
+0 -1 range, which meant line width was always 1px less that expected
@jahow jahow force-pushed the webgl-fix-line-antialiasing branch from 47b8e14 to ae4b923 Compare February 14, 2024 12:51
@jahow jahow merged commit 64773de into openlayers:main Feb 14, 2024
8 checks passed
@jahow jahow deleted the webgl-fix-line-antialiasing branch February 14, 2024 12:56
@jahow
Copy link
Contributor Author

jahow commented Feb 14, 2024

thanks for the quick review!

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

Successfully merging this pull request may close these issues.

None yet

2 participants