Skip to content

Should better support and expose Data features #153

Description

@wesalvaro

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>

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions