lvsucceed 2021-08-25 09:10 采纳率: 0%
浏览 259

canvas 如何实现固定区域内旋转、拖拽、伸缩?

请假各位,canvas 如何实现固定区域内旋转、拖拽、伸缩?
1、canvas如果现在只在固定区域进行推着,超出固定区域不显示。
2、如果图片原始周围出现操作按钮如下图:
3、实现下图功能,都需要什么属性
4、不使用框架,因为后续要把代码迁移到小程序端,小程序不识别外部js。

下图是想要实现的效果:有辅助线、操作按钮、区域边框

img

下图是我已实现的代码、和效果图


<!DOCTYPE HTML>
<html>
<body>

<canvas  id="myCanvas" width="450" height="514"></canvas>
<img id="scream" src="images/zheng.png" style="display: none;">

<script type="text/javascript">

var canvas=document.getElementById('myCanvas');
var ctx=canvas.getContext('2d');
var img=document.getElementById("scream");

img.onload = function()
{
    ctx.drawImage(img,0,0,450,512);
}



</script>

</body>
</html>

img

  • 写回答

1条回答 默认 最新

  • asinowant 2021-08-25 10:33
    关注

    save后clip再变换绘图再restore

    评论

报告相同问题?

问题事件

  • 创建了问题 8月25日

悬赏问题

  • ¥15 目详情-五一模拟赛详情页
  • ¥15 有了解d3和topogram.js库的吗?有偿请教
  • ¥100 任意维数的K均值聚类
  • ¥15 stamps做sbas-insar,时序沉降图怎么画
  • ¥15 买了个传感器,根据商家发的代码和步骤使用但是代码报错了不会改,有没有人可以看看
  • ¥15 关于#Java#的问题,如何解决?
  • ¥15 加热介质是液体,换热器壳侧导热系数和总的导热系数怎么算
  • ¥100 嵌入式系统基于PIC16F882和热敏电阻的数字温度计
  • ¥15 cmd cl 0x000007b
  • ¥20 BAPI_PR_CHANGE how to add account assignment information for service line