javascript - 选择图像的一部分并使用 jQuery 检索其坐标

标签 javascript jquery image coordinates

我需要一种方法让用户通过调整透明矩形的大小或通过单击并拖动选择区域(就像在桌面操作系统中所做的那样)来选择图像的一部分,这两种方法都适合我。然后我需要使用 jQuery 检索所选区域的坐标。

请推荐可能有帮助的示例或 tuts(如果有的话)、方法或 API 文档部分。

最佳答案

参见 Jcrop这是演示。

<!-- This is the image we're attaching Jcrop to -->
<img src="demo_files/pool.jpg" id="target" alt="Flowers" />

和脚本:

<script type="text/javascript">

jQuery(function($){

  $('#target').Jcrop({
    onChange:   showCoords,
    onSelect:   showCoords
  });

});

// Simple event handler, called from onChange and onSelect
// event handlers to show an alert, as per the Jcrop 
// invocation above

function showCoords(c)
{
  alert('x='+ c.x +' y='+ c.y +' x2='+ c.x2 +' y2='+ c.y2)
  alert('w='+c.w +' h='+ c.h)
};

</script>

关于javascript - 选择图像的一部分并使用 jQuery 检索其坐标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9822371/

相关文章:

python - Django,在从管理面板上传的模板中显示图像

javascript - 在 pixi.js 中初始加载后访问纹理

javascript - 在 AngularJS 中实现授权

javascript - 如何在 Vue 中转发 $refs

jQuery SlideToggle Google map 问题

javascript - 打开多个切换框而不是 1 个

javascript - 使用 forEach() 删除对象元素

php - 填充 onchange 事件的第二个下拉列表

php - 将图像放在另一图像的左下角

iphone - iPhone 上网站的 Retina Graphics 非常浪费