📜  聚合物Google图表

📅  最后修改于: 2021-01-08 01:00:58             🧑  作者: Mango

高分子Google图表

聚合Google图表是一个元素,其中包含用于可视化数据的图表.Google图表包含各种图表,例如饼图,折线图,柱形图,面积图,树形图等。

您可以将高度和宽度定义为Google图表元素中的样式属性。

google-chart {
   height: 100px;
   width: 300px;
}

有很多方法可以将数据提供为JSON格式的属性。

使用cols和rows属性:

cols = '[{"label":"Month", "type":"string"}, {"label":"Days", "type":"number"}]'
rows = '[["Oct", 31],["Nov", 30],["Dec", 31]]'

使用数据属性:

  • 您可以直接传递数据
data = '[["Month", "Days"], ["Oct", 31], ["Nov", 30], ["Dec", 31]]'
  • 您可以在URL中传递数据
data = 'http://demo.com/chart-data.json'
  • 您可以在Google DataTable对象中传递数据
data = '{{dataTable}}'
  • 使用视图属性:
view = '{{dataView}}'

运行以下命令以在您的项目目录中安装google chart元素。之后,您可以在应用程序中使用此元素:

bower install PolymerElements/google-chart --save

例:

创建一个index.html文件,并在其中添加以下代码,以查看Polymer.js中google-chartelement的用法。




google-chart