如何自定义图表

Stay organized with collections Save and categorize content based on your preferences.

您可以将 Google 图表工具的默认设置用于它们;所有自定义设置都是可选的,并且基本设置已可正式发布。不过,如果网页采用的样式与提供的默认值不一致,图表可以很容易地自定义。每个图表都提供多种选项,用于自定义其外观和风格。这些选项在传入图表的 draw() 方法的选项选项中表示为“名称:值”对。

图表通常支持适合该可视化的自定义选项。例如,表格图表支持使用 sortColumn 选项指定默认排序列,饼图可视化图表支持使用 colors 选项来指定切片颜色。每个图表的文档都应说明其支持的选项。

您将选项作为可选的第二个参数传入图表的 draw() 方法(如前所述)。您可以通过使用每个图表专用的属性创建一个对象来指定选项。

以下示例演示了如何创建用于指定所有这些属性的选项对象:

var options = {
  width: 400,
  height: 240,
  title: 'Toppings I Like On My Pizza',
  colors: ['#e0440e', '#e6693e', '#ec8f6e', '#f3b49f', '#f6c7b6']
};

chart.draw(data, options);

下面是此代码创建的图表。

您还可以在 draw() 方法中直接指定选项:

chart.draw(data, {
  width: 400,
  height: 240,
  title: 'Toppings I Like On My Pizza',
  colors: ['#e0440e', '#e6693e', '#ec8f6e', '#f3b49f', '#f6c7b6'],
  is3D: true
});

下面是此代码创建的图表。

更多信息