Javascript 如何相对于在mousedrag上旋转的画布旋转div

Javascript 如何相对于在mousedrag上旋转的画布旋转div,javascript,html,jquery,css,Javascript,Html,Jquery,Css,我有一个帆布管1CTX和一个id为正弦波的div。使用纯Javascript在鼠标拖动时旋转画布。现在我需要同时相对于画布旋转div(相同的角位移)。当我尝试使用下面的代码时,在拖动和旋转画布时,转换样式不会得到更新。谁能帮我解决这个问题 function tubeRotate(e){ if (moveFlag2){ tube1XPos = e.clientX - tube1Canvas.offsetLeft; tube1YPos = e.client

我有一个帆布管1CTX和一个id为正弦波的div。使用纯Javascript在鼠标拖动时旋转画布。现在我需要同时相对于画布旋转div(相同的角位移)。当我尝试使用下面的代码时,在拖动和旋转画布时,转换样式不会得到更新。谁能帮我解决这个问题

function tubeRotate(e){
    
    if (moveFlag2){
    
    tube1XPos = e.clientX - tube1Canvas.offsetLeft;
    tube1YPos = e.clientY - tube1Canvas.offsetTop;  
    
        
    rotate = tube1XPos-((e.clientX-tube1Canvas.offsetLeft));    
    rotate = (Math.atan(240/rotate))* Math.PI / 180;
    tube1Ctx.clearRect(240,10,tube1Canvas.width,tube1Canvas.height);    
    tube1Ctx.translate(275, 10);
    tube1Ctx.rotate(rotate);    
    tube1Ctx.translate(-275,-10 );  
    tube1Ctx.drawImage(tube1Img,240 , 10 , 46 , 235 );
    

        var angle=rotate;

    document.getElementById("sineWave").style.MozTransformOrigin='0% 0%';
    document.getElementById("sineWave").style.MozTransform =  'rotate('+angle+'rad)';
    
    document.getElementById("sineWave").style.webkitTransformOrigin='0% 0%';
    document.getElementById("sineWave").style.webkitTransform = 'rotate('+angle+'rad)';
}
缺少报价


document.getElementById(“sineWave.style.MozTransformOrigin='0%0%';

很抱歉,我将代码复制到此处时出错,它在我的工作副本中。