简介
借助 HTML 标准，您可以使用图片映射指定网页图片上的热点。这些热点可用于显示悬停文本或用作链接，您甚至可以添加 JavaScript 事件处理以启用互动性。例如，将鼠标悬停在以下图片的条形和轴标签上：
这些热点是使用 <map> 和 <area> HTML 元素创建的。Chart API 可以返回为其创建热点地图所需的所有坐标，如下文所述。
为图表创建映射
如果您向图表网址添加参数 chof=json，则会收到一个 JSON 字符串，其中包含为图表创建图片映射所需的所有数据。然后，您可以添加指向图表的特定部分的链接，或者为点击事件附加 JavaScript 函数，使图表更具互动性。请注意，并非所有图表类型都支持此功能；如需了解详情，请参阅特定图表文档。
此页面上的工具可帮助您生成图片映射的 HTML。您可以将此 HTML 永久嵌入网页，甚至还可以将我们的代码复制到网页中，然后即时请求并生成地图，前提是您的网页允许用户动态更改网页上的地图。
下文介绍了使用此工具生成映射的方法：
- 获取图表的 JSON 输出：将
chof=json添加到您的图表网址，在浏览器中访问该网址，然后复制返回的文本。 - 将您复制的 JSON 文本粘贴到下面标记为“JSON Output”的文本框中，然后点击“Make Map”。
- 将生成的地图代码粘贴到您的网页中
- 使用
<map>元素的唯一名称更新生成的代码。 - 移除不需要的所有地图元素（例如，特定的条形、切片、标签或轴元素）。
- 更新生成的
<area>元素中的 href 属性。 - 将属性
usemap="#MAP_NAME"添加到<img>元素中，将其中的MAP_NAME替换成地图的名称。重要提示：请务必在 usemap 值前添加“#”前缀。例如：
usemap="#mymap"。在这种情况下，映射名称是“mymap”，而不是“#mymap”。
JSON 字符串的格式
以下是在您指定 chof=json 时返回的 JSON 格式：
- 一个名为 chartshape 的根对象。此对象存储的是对象的数组，其中每个对象代表图表图片映射中的一个区域。每个对象都具有以下属性：
- name - 此特定区域的名称。一般命名惯例为 elementtype_series#_item#。例如：bar0_0 表示描述第一个系列中第一个条形的区域，而 axis0_1 表示描述 x 轴上第二个轴标签的区域。
- type - 此区域的形状。它将是以下值之一（具体取决于图表类型）：RECT、CIRCLE 或 POLY。这相当于
<area>标记的 shape 属性。 - coords - 用于描述相应区域的数字数组；相当于
<area>标记的 coords 属性。