Skip to main content
Participant
May 25, 2023
Answered

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

  • May 25, 2023
  • 4 replies
  • 427 views

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

    This topic is closed to new replies. Start a new post to keep the conversation going.
    Correct answer Shabbar28866904fotm

    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;
    
    }

    4 replies

    Participant
    May 25, 2023

    it looks like it is due to Window: devicePixelRatio property  

    kglad
    Community Expert
    Community Expert
    May 25, 2023

    so, your question is answered?

    Shabbar28866904fotmAuthorCorrect answer
    Participant
    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;
    
    }