我遇到的问题是图片大于画布的尺寸,要求初始时在画布显示图片大小,只有画布的大小就可以了,拖拽就需要判断是否超出图片(即画布不可以出现空白),缩小的临界值也就是初始画布显示的临界值 这个问题请问如何解决呢
canvas的绘制上下文对象可以获取到图形的具体信息的(长、宽、像素点数组) -> getImageData,有这些数据后,你只需要在拖拽事件中加判断就行了啊
有点没明白你的问题,图片大于画布尺寸,你可以设置图片大小呀。
我做的是移动端一个项目,就是画布显示在屏幕上是固定的, 之后显示的是一张很大的图片,用户滑动的话 可以通过不断的滑动可以观察到图片img的不同区域,也要根据点击不同区域显示不同的东西
我利用canvas drawimage方法已经实现了这个功能 大致思路就是 drawImage() 动态改变这个方法的前8个参数 dx、dy、imgwidth、imgheight这四个参数,临界距离也比较好判断 但是现在又遇到问题是 客户那边提的需求是要让用户动态点击这个canvas画布的不同区域 弹出对应的弹窗,据我了解canvas只是一个画布 是没有交互功能的 那这样是不是就不能用这个思路了
不能出现留白,那就需要根据图片的长宽比来设置图片初始放大比例。
至于楼主说的点不同区域弹出弹框,因为图片是动态的(指不定图片多长多宽,而且也不知道图片具体要显示什么) 所以点击功能不能基于图片,只能是通过canvas在图片上做二次开发,比如说添加一些小图标、闭合区域等功能,这些因为有相对坐标/位置,所以是可以捕获的