Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

optimize svg quality in html5 canvas object

Community Beginner ,
Mar 23, 2024 Mar 23, 2024


Is there a way to render svg elements with crisp edges while still keeping anti-aliasing in adobe animate ?

I created a mobile banner in html5 canvas with a small svg logo.
Unfortunately the shapes of the logo aren't looking crisp.

220
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Beginner , Mar 24, 2024 Mar 24, 2024

Hi João César,

Thanks for the detailed instructions. I learned something new.

The issue was on my side.

My default monitor is quite old and it does not render the logo correctly.
The banner looks crisp on my second hd monitor.
You can close this discussion.
Jens

Translate
Community Expert ,
Mar 23, 2024 Mar 23, 2024

Hi.

 

You exclude your logo from texture generation and keep it as vector at runtime.
image.pngexpand imageimage.pngexpand image

 

You can also set Animate to publish everything as vector if performance is not a big issue in your banner.
image.pngexpand image

 

Alternatively, you can bring assets that have a imported size bigger than the published size.

 

And you can raise the resolution of the generated textures in the Publish Settings as well.

I hope that one of this options helps you.

Regards,
JC

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 24, 2024 Mar 24, 2024
LATEST

Hi João César,

Thanks for the detailed instructions. I learned something new.

The issue was on my side.

My default monitor is quite old and it does not render the logo correctly.
The banner looks crisp on my second hd monitor.
You can close this discussion.
Jens

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines