Javascript 使用jquery，我希望根据坐标将一个图像放置在另一个图像上

我试图根据坐标将一个图像放置在另一个图像上

我的html是：

<button id="add">add image</button>
<div id="container">
    <img src="http://www.rangde.org/newsletter/nov11/images/real_tree.png" width="400" usemap="#treemap" />
</div>
<map name="treemap">
    <area shape="circle" coords="345,483,13" alt="Venus" href="#" />
    <area shape="circle" coords="333,361,13" alt="Venus" href="#" />
    <area shape="circle" coords="302,284,13" alt="Venus" href="#" />
    <area shape="circle" coords="79,350,13"  alt="Venus" href="#" />
    <area shape="circle" coords="55,489,13"  alt="Venus" href="#" />
</map>

---

我恐怕无法在

论坛上设置
背景
，
是一个人们谈论类似问题的论坛我将使用
而不是地图，这将帮助您实现同样的目标。只需将它们设置为“位置：绝对”，其中“顶部”和“左侧”具有坐标值，“宽度”、“高度”具有大小值（因为它只有13个像素，我不认为矩形和圆形会有那么大的不同）。为它们分配一个类名，以便使用jQuery选择它们。不要忘记将“容器”设置为“位置：相对”。
不幸的是，这不是图像映射的适当用法，因为它们实际上不是可以设置样式的元素

但是，如果您将此选项切换为在与贴图圆相同的位置使用一些绝对定位的div，并结合CSS
border radius
属性，则可以创建您想要的效果：

这应该是解决您问题的一个非常简单的方法。
试试这个插件，它可能会有所帮助。它仍在开发中，但您可以看看它。
这里是演示链接
添加图像代码在哪里？你所做的就是在点击时改变背景颜色。你能帮我改变背景颜色吗？我猜你的意思是在树上添加一个图像，对应于其中一个图像映射区域？第三个坐标是什么？我编辑了这个问题，请检查它参见：
$('document').ready(function(){
    $('#add').click(function() {
        $('area[alt=Venus]').css('background','http://www.rangde.org/newsletter/nov11/images/green-ball.png');
    });
});