AnyChart使用鼠标在图表中移动和调整图像大小

Question

我正在寻找一种在图表中/上方放置多个图像的方法，然后用户可以用鼠标移动和缩放这些图像。 目前我正在使用：

var image = anychart.graphics.image(imageurl, x, y, width, height);
image.parent(chartcontainer);

在绘制图表后，在图表上绘制图像。 但是，我不知道如何调整大小和移动。

或者我应该为此目的使用graphics.image以外的其他东西？

我以前也尝试过注释标签。

var controller = chart.annotations();
var annotation = controller.label();
annotation.valueAnchor(706);
annotation.xAnchor(50);
annotation.anchor('top-left');
annotation.text("");
annotation.width(200);
annotation.height(200);
annotation.background({
"enabled": true,
"fill": {
src: imageurl,
mode: "stretch"
}   
});

这些行为完全符合预期，具有鼠标拖动和缩放标记。但顾名思义，它们只能用作图表中的注释，因此只能放置在我的图表系列(valueAnchor、xAnchor(的某些值上。但我也希望能够通过简单地指定 X 和 Y 坐标(如graphics.image(将图像放置在图表之外，例如在标题区域中。还是有可能而我错过了什么？

如果有人能帮助我，我会很高兴。

Answer 1

图形库不提供用于调整图像大小的现成解决方案。应实现调用库 API 以更改图像宽度/高度或应用缩放的鼠标侦听器。 但它支持拖动功能，请检查示例。 可能，任何专门处理图像的第三方库都更适合您。

Answer 2

现在，我已经通过挂在图形图像的鼠标悬停事件上，然后在图像上放置一个div来实现我的目标，我使该图像可调整大小和可拖动。调整大小和拖动div 时，我设置了图像的 x 和 y 坐标，以及宽度和高度。它运行良好，并提供所需的结果。