0

I have a draggable div that represents a little info popup that the user can drag around the screen. But this div is anchored to a point on the screen, and I would like there to be a caret drawn between the div and the point that it is anchored to.

An example of this can be found on Google maps, when you hover over a store or point of interest that you've searched for. You'll see a caret drawn between the point and the popup. This is simple enough, but their popup is not draggable while mine is.

So what is the best way to implement this? I'm thinking of using a series of caret images that are resized depending on the orientation of the popup relative to the anchor point. It'll get tricky in that I'll have to use a different type of caret depending on the angle at which the popup is placed relative to the anchor. Is there a better way to do this?

Thanks!

4

2 回答 2

1

所以你实际上是在尝试在屏幕上的两点之间绘制动态图像？我不确定这在 HTML 中有多实用。dom 不支持图像旋转，并且图像大小的质量受到限制。您可以进行服务器大小的图像生成，但这会很慢并且会给您带来很高的服务器负载。

一些较新的浏览器（不是 IE）支持 Canvas 对象，如果您愿意排除 80% 的用户，则可以这样做。

最后，我不确定是否有比您已经在想的更好的解决方案 - 我不确定它的效果如何。

于 2008-12-16T22:04:18.657 回答
0

这篇关于在 JavaScript 中绘制线条的教程可能对您有所帮助，因为它向您展示了如何使用 JavaScript 进行相对高效的动态线条绘制（参见页面底部的示例）。

此外，我还使用jsgraphics库通过清除当前行并在用户每次移动线的端点时绘制一个新行来实现类似的效果。

于 2009-05-06T18:10:55.003 回答