Question

我使用AngularJS和HTML创建了一个网站，我想加载静态图像并在此图像上创建交互式点。

当我将鼠标悬停在此位置时，我想要一些带有一些信息的弹出通知。

我应该使用哪个库？我检查了OpenLayers，但我不知道它是否是我想做的正确选择

我认为这样的解决方案：

Answer 1

您可以使用html图片地图。这是一个例子：

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<p>Click on the sun or on one of the planets to watch it closer:</p>

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>

<script>
$( "area" ).hover(
  function() {
    alert('This is ' + $( this ).attr("alt"));
  }
);
</script>

</body>
</html>

来源： w3schools jQuery

交互式图像AngularJs

1 个答案: