-
Notifications
You must be signed in to change notification settings - Fork 134
Open
Labels
Milestone
Description
Some ideas below...
google-chart-data.output is a google.visualization.DataView
google-chart-data.input is a URL, DataTable format object, or DataTable object.
This google-chart-data element is created inside the google-chart element to work with today's approach.
Example with current data (in addition to current approach)
<google-chart-data input="[[myData]]" output="{{output}}"></google-chart-data>
<google-chart data="[[output]]"></google-chart>Example with rows and columns DataTable format objects
<google-chart-data
rows="[[myRows]]"
cols="[[myCols]]"
output="{{output}}"></google-chart-data>
<google-chart data="[[output]]"></google-chart>Example with new data features
Some google-chart-format elements may be nested to format the columns of the chart.
Passing selection back into the google-chart-data element will set the value attribute with the selected rows from the DataTable. The show-rows and show-cols attributes can be calculated from the input data.
<google-chart-data
input="[[myData]]"
output="{{output}}"
selection="[[selection]]"
value="{{value}}"
show-rows="[[rowsToShowArray]]"
show-cols="[[colsToShowArray]]">
<google-chart-format
type="number" col="3" options="[[changeColumnOptions]]"></google-chart-format>
<google-chart-format
type="string" col="4" options="[[nameColumnOptions]]"></google-chart-format>
</google-chart-data>
<google-chart data="[[output]]" selection="{{selection}}"></google-chart>Example with Query
The resulting DataTable from a google-chart-query may be directly passed into a google-chart or can be manipulated via an intermediate google-chart-data element.
<google-chart-query
href="/data"
table="{{dataTable}}"
params="[[params]]"
refresh="300"></google-chart-query>
<google-chart data="[[dataTable]]"></google-chart>
<google-chart-data input="[[dataTable]]" output="{{output}}">
<google-chart-format
type="number" col="3" options="[[changeColumnOptions]]"></google-chart-format>
</google-chart-data>
<google-chart data="[[output]]"></google-chart>