Using a Input box to let users search

[Johnathon Taylor]

Hi,

Im really new to google Api's and have very recently started using the
visualisation API to display some of my company's reporting on an
Intranet page.

The problem im having is letting a viewer filter the data using a text
input, I using the playground to come up with some great Idea for drop
down lists that get us so far but to really make the page useful the
user would need to search for certain items

I saw that the playground did give the user a chance to query the data
using the GQL parameters and that seemed to work fine for me, but I
would love to part write the query (say "Where D contains") and let
the user just enter the text they want to search on ?

Hope this is possible

Many Thanks for any help anyone can offer

[Badtnik]

Hi

Sounds like an interesting feature, we are definitely already considering implementing such a library widget and might do so in the future, but still have non formal concrete plans

  Badtnik

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

[Johnathon Taylor]

So are we saying that this is currently not possible, either using
standard functionality or by hacking the url?

> > google-visualizati...@googlegroups.com<google-visualization- api%2Bunsu...@googlegroups.com>
> > .

[Youssef51]

Hi Jonathan -

I'm currently doing this with a PHP function that I wrote that queries
tables on a MySQL database.

Users can currently use dropdowns and checkboxes to set WHERE
selections on several variables, choose X and Y axis variables, limit
time series depth, set chart size and chart type and choose between
several data source tables which contain different states of a
simulation we are running.

The settings are processed on the server and return a correctly
formatted data set to a Motion Chart embedded in a PHP / HTML page
that refreshes every time a change is requested. The Motion Chart
displays the users' chosen data and visualization settings for further
analysis.

All these choices are saved between sessions in cookies so they
"persist" for users - something they definitely appreciate. Switching
between different source tables in the same Motion Chart was a bit
tricky, but it works.

An interesting aspect of this function is that - with the exception of
the first 2 variables in the data source table - it does not matter
what variables the tables contain, what they are called, what order
they occur in or even how they are represented as data types in the
table. The function reads the variable names and types and fills in
the corresponding drop downs accordingly. In alphabetical order to
make it easier to find variables when there are 40 - 50 of them to
choose from.

So: it can be done. Your specific idea "Where D contains" could be
implemented through simple LIKE syntax in the SQL statement that the
PHP function assembles.

Hope this helps.

[Melissa]

Hi, 

Wondering if you ever found a solution outside of PHP for this? 

I've been trying to do the same on an intranet site as well. 

Trying to use stringfilter on a datasource, but am unable to get it going... :/

~ Mel

Here's what I've tried. 

function drawVisualization() {
  // Prepare the data.
  var data = google.visualization.arrayToDataTable('http://spreadsheets.google.com/pub?key=rh_6pF1K_XsruwVr_doofvw');

  // Define a StringFilter control for the 'Name' column
  var stringFilter = new google.visualization.ControlWrapper({
    'controlType': 'StringFilter',
    'containerId': 'control1',
    'options': {
      'filterColumnLabel': 'Name'
    }
  });

  // Define a table visualization
  var table = new google.visualization.ChartWrapper({
    'chartType': 'Table',
    'containerId': 'chart1',
    'options': {'height': '13em', 'width': '20em'}
  });

  // Create the dashboard.
  var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard')).
    // Configure the string filter to affect the table contents
    bind(stringFilter, table).
    // Draw the dashboard
    draw(data);

[asgallant]

You have to query the data source, you can't just pass the URL to the DataTable constructor.  Try this: http://jsfiddle.net/asgallant/2Yxjb/.  I couldn't test this, since the spreadsheet isn't published, so you will have to test it yourself.