可视化数据网页开发Google Charts(一):加载库

Google Charts

除少数例外情况外,所有包含Google图表的网页都应在网页的中包含以下几行:


此示例的第一行加载加载器本身。 无论您计划绘制多少个图表,您都只能加载一次加载器。 加载加载程序后,您可以调用google.charts.load函数一次或多次来加载特定图表类型的包。

google.charts.load的第一个参数是版本名称或数字,作为字符串。如果您指定“current”,则会导致加载最新的Google图表正式版。如果您想尝试下一版本的候选人,请使用“upcoming”。一般情况下,两者之间的差异很小,除非正在进行新的发布,否则它们将完全相同。使用即将发布的一个常见原因是,您希望测试Google即将在未来一两个月内发布的新图表类型或功能。 (我们在论坛上宣布即将发布的版本,并建议您在宣布时试用它们,以确保您的图表的任何更改都是可以接受的。)

上面的示例假设您要显示corechart(条形图,柱形图,线条,区域,阶梯区域,气泡,饼图,圆环图,组合图,烛台图,直方图图,散点图)。如果您需要不同的或额外的图表类型,请替换或添加上面的corechart的相应包名称(例如,{packages:['corechart','table','sankey']}。您可以在''中找到包名称加载每个图表的文档页面的“部分”。

此示例还假定您在网页的某处定义了名为drawChart的JavaScript函数。您可以随意命名该功能,但请确保它是全局唯一的,并且在您调用google.charts.setOnLoadCallback之前引用它之前已定义。

 

下面是一个饼图示例


  
  


  
  

加载详情

首先,您必须加载加载器本身,这是在一个单独的脚本标记中使用src=“https://www.gstatic.com/charts/loader.js”来完成的。此标记可以位于文档的头部或主体中,也可以在加载时或加载完成后动态地插入到文档中。

加载程序加载后,您可以自由地调用google.chart .load。调用它的位置可以在文档头部或主体的脚本标记中,也可以在文档仍在加载或加载完成后的任何时候调用它。

从45版开始,您可以调用google.charts。加载多个包以加载其他包,但是如果您这样做,您必须每次提供相同的版本号和语言设置。

google.charts.load的第一个参数。load调用是版本名或版本号。此时只有两个特殊的版本名,以及几个冻结的版本。

  • current

这是最新的官方版本,每次我们推出一个新的版本时都会发生变化。理想情况下,这个版本经过了良好的测试,并且没有bug,但是您可能想要指定一个特定的冻结版本,而不是在您确定它可以正常工作之后。

  • upcoming

这是为下一个版本,而它仍在测试中,并在成为正式的当前版本之前。请定期测试此版本,以便您尽快知道在此版本正式发布之前是否有任何需要解决的问题。

 

当发布谷歌图表的新版本时,一些变化是很大的,比如全新的图表类型。其他的变化很小,比如对现有图表的外观或行为的增强。

许多谷歌图表的创建者对图表的外观和感觉进行微调,直到它完全符合他们的需要。有些创作者可能更愿意知道他们的图表永远不会改变,不管我们在未来做了什么改进。对于这些用户,我们支持冻结的谷歌图表。

冻结的图表版本由编号来标识,并在官方版本中进行了描述。要加载冻结版本,请替换current或upcoming调用google.charts.load冻结版本号:


预计冻结版本将无限期可用,尽管我们可能会停用具有安全问题的冻结版本。通常不提供对冻结版本的支持,除非毫无帮助地建议您升级到新版本。

加载设置

调用google.charts.load中的第二个参数。load是用于指定设置的对象。设置支持以下属性。

  • packages

由零个或多个包组成的数组。加载的每个包都有支持一组功能(通常是图表类型)所需的代码。每个图表类型的文档中都列出了您需要加载的软件包。如果使用ChartWrapper自动加载所需的包,则可以避免指定任何包。

  • language


用于自定义可能是图表一部分的文本的语言或区域设置的代码。有关详细信息,请参见locale。

  • callback

一个函数,该函数将在加载包之后调用。或者,您可以通过调用google.charts.setOnLoadCallback来指定这个函数。setOnLoadCallback,如上例所示。有关详细信息,请参见回调。

  google.charts.load('current', { packages: [ 'corechart'], callback: drawChart });

 

你可能感兴趣的:(数据可视化开发,数据可视化开发)