如何创建可点击的地图

Question

我想拍一张加利福尼亚州的地图，将其分成几个区域，然后让用户将鼠标悬停在这些区域上。当他们点击区域时，它会将页面向下滚动到指定的点，在那里他们可以阅读更多信息。我该怎么做？

Answer 1

只需创建一个图像并在其上应用地图，如下所示：

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

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="#sun" alt="Sun">
  <area shape="circle" coords="90,58,3" href="#mercur" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="#venus" alt="Venus">
  <area shape="poly" coords="48,311,105,248,96,210,75,205,38,234,8,310" href="#anything" title="Anything">
</map> 

Answer 2

对于地图可视化，您可以使用传单。有关地图图层的示例，请参阅：Leaflet chloropleth example。

Answer 3

你有没有想过为此目的使用基于SVG的地图？

例如www.makeaclickablemap.com之类的工具。