简介
借助 HTML 标准，您可以使用图像地图来指定网页图片上的热点。这些热点可用于显示悬停文字或用作链接，甚至可以添加 JavaScript 事件处理以实现互动。例如，将鼠标悬停在下图的条形和轴标签上：
这些热点使用 <map> 和 <area> HTML 元素创建。Chart API 可以返回为其创建热点地图所需的所有坐标，如下文所述。
为图表创建映射
如果您将参数 chof=json 添加到图表网址，将会收到一个 JSON 字符串，其中包含为图表创建图像映射所需的所有数据。然后，您可以添加指向图表特定部分的链接，或将 JavaScript 函数附加到点击事件中，以提高图表的互动性。请注意，并非所有图表类型都支持此功能；如需了解详情，请参阅具体的图表文档。
此页面上的工具可帮助您生成图像地图的 HTML。您可以将此 HTML 永久嵌入自己的页面中，甚至可以将我们的代码复制到您的页面中，然后请求并动态生成地图（如果您的页面允许用户动态更改页面上的地图）。
下文介绍了使用此工具生成映射的方法：
- 获取图表的 JSON 输出：将
chof=json添加到图表网址，在浏览器中转到该网址，然后复制返回的文本。 - 将复制的 JSON 文本粘贴到下面的文本框中，并将其标记为“JSON 输出”，然后点击“创建映射”。
- 将生成的地图代码粘贴到您的页面中
- 使用
<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；对于描述 x 轴上第二个轴标签的区域，则为 axis0_1。
- type - 该区域的形状。根据图表类型，它将是以下值之一：RECT、Circle 或 POLY。这相当于
<area>标记的 shape 属性。 - coords - 描述区域的数字数组；相当于
<area>标记的 coords 属性。