1. 首页
  2. 问答
  3. 放大图像的一部分？

放大图像的一部分？

2013-08-20 19 views
1

如何缩放图像的一部分而不必使用两个图像。我的意思是，假设你只有一张图像不够大。我想在鼠标悬停时放大图像的一部分（超过100％）。我不在乎它是否会导致像素化（当然会这样）。 我试过http://zoomy.me/home，但它也使用两个不同的图像（小图像和更大版本的图像）。放大图像的一部分？

来源

2013-08-20 Arbaaz

+0

你用'C＃'和'javascript' /'jquery'标记。哪种语言必须关注缩放？或者解决方案的语言无关紧要？ –

+0

@MikedeKlerk我正在研究asp.net c＃。我确定使用c＃，js或JQuery三种语言中的任何一种解决方案。 – Arbaaz

+1

如果您只有一个图像，则可以将多个图像缩放库中的低分辨率图像和“高分辨率”图像引用为同一个文件。 – Yuck

回答

1

遵循以下步骤：

  • 用帆布渲染图像
  • 使用getImageData（）来获得的像素替换图像矩形围绕鼠标指针
  • 创建新的放大图像数据
  • 使用putImageData（）将放大的数据渲染到另一个画布

我只是写了个例子在这里：http://kirox.de/test/magnify.html

来源

2013-08-20 12:19:57 oyophant

+0

我认为你的方法可能适合我，但你可以请给我一点点getImageData（）的细节？我应该如何获得像素的矩形围绕鼠标指针？ – Arbaaz

+0

您是否看过示例代码？它全部位于onmousemove处理程序中。使用鼠标x和y（相对于图像），可以使用ctx.getImageData（x- 10，y-10,20,20）。您可以在这里找到的方法的文档：https：//developer.mozilla.org/en/docs/Web/API/CanvasRenderingContext2D#getImageData（） – oyophant

相关问题

 相关问题