Question

我有以下代码，这是Google Maps V3上的自定义图标。我想使用jQuery.Rotate插件旋转它。

var image = new google.maps.MarkerImage(
    "markers/test.png",
    new google.maps.Size(52, 52), // size
    new google.maps.Point(0, 0), // origin
    new google.maps.Point(20, 0) // anchor
);


marker = new google.maps.Marker(
{
    map: map,
    draggable: false,
    position: markerData[i].latLng,
    visible: true,
    icon: image,
    optimized: false
});

问题是jQuery.Rotate希望DOM id识别要旋转的元素.Markerimage没有一个，我无法指定它。

EG。

<img src="img" id="image">
$("#image").rotate(15);

任何人都可以给我看一些示例代码，它允许我为MarkerImage分配一个id，以便jQuery.Rotate可以使用它，例如。 #image假设id是id =“image”，还是有另一种方法告诉jQuery.Rotate使用MarkerImage而不是指向DOM元素？

任何帮助将不胜感激..如果我找不到答案，我需要为我使用的每个图标创建相同图标的360个版本，其中有很多。我更喜欢使用这个特定的插件。希望有一个简单的答案。

Answer 1

我不能提供'答案'，只是提示和观察。

假设您的地图是名为“地图”的DOM对象，请查看DOM对象map.l.innerContainer.outerHtml。（那是一个小写的“l” - map.l）

在outerHtml中，在许多其他div中，您应该能够找到包含图标的img文件的div。

我想和你做同样的事情，动态旋转图标，但我还没有时间看看我是否可以组织一种方法在这些div上添加id以方便使用jquery旋转它们。 div由api创建。

文献中描述了一些DOM突变事件（如DOMNodeInsertedIntoDocument），但显然它们的实现不可靠/不均匀，听起来它们已经从W3C规范中删除了。我还没有尝试过任何这些，所以无法根据个人经验发表评论。

在我的情况下，我决定为每个主要方向创建图标文件，N NNE NE ENE等。对于我的应用程序，似乎可以使图标对齐，看起来不错。

如果您成功完成任务，请在此处与他人分享您的解决方案。

Google Maps v3 MarkerImage＆amp; jQuery.Rotate

1 个答案: