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

why canvas width is double in html then adobe animate document width

Community Beginner ,
May 24, 2023 May 24, 2023

Copy link to clipboard

Copied

Adobe animate document width is 900 while canvas width is double 1800 in HTML, why is this  

Views

228

Translate

Translate

Report

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 , May 25, 2023 May 25, 2023

Yes to some extent, I calculate canvas width and height by multiplying with devicePixelRatio

var pRatio = window.devicePixelRatio || 1;


function handleMouseMove(evt) {
    if (oldX) {
        drawingCanvas.graphics.beginStroke(color)
            .setStrokeStyle(size, "round")
            .moveTo(oldX, oldY)
            .lineTo(evt.stageX / pRatio, evt.stageY / pRatio);
        stage.update();
    }
    oldX = evt.stageX / pRatio;
    oldY = evt.stageY / pRatio;

}

Votes

Translate

Translate
Community Beginner ,
May 25, 2023 May 25, 2023

Copy link to clipboard

Copied

it looks like it is due to Window: devicePixelRatio property  

Votes

Translate

Translate

Report

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 Expert ,
May 25, 2023 May 25, 2023

Copy link to clipboard

Copied

so, your question is answered?

Votes

Translate

Translate

Report

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 ,
May 25, 2023 May 25, 2023

Copy link to clipboard

Copied

Yes to some extent, I calculate canvas width and height by multiplying with devicePixelRatio

var pRatio = window.devicePixelRatio || 1;


function handleMouseMove(evt) {
    if (oldX) {
        drawingCanvas.graphics.beginStroke(color)
            .setStrokeStyle(size, "round")
            .moveTo(oldX, oldY)
            .lineTo(evt.stageX / pRatio, evt.stageY / pRatio);
        stage.update();
    }
    oldX = evt.stageX / pRatio;
    oldY = evt.stageY / pRatio;

}

Votes

Translate

Translate

Report

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 Expert ,
May 25, 2023 May 25, 2023

Copy link to clipboard

Copied

LATEST

good to hear.

Votes

Translate

Translate

Report

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