Importing data for use with Google Charts

Elastic Stack Elasticsearch
1

I'm attempting to render a Google Chart based on an Elasticsearch query.
Here is my non-working code:

// Load the Visualization API and the piechart package.
google.load('visualization', '1', {'packages':['corechart']});
  
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
  
function drawChart() {
  var jsonData = $.ajax({
      url: 'http://localhost:9200/inventory/_search?pretty=true'
           , type: 'POST'
           , data :

JSON.stringify(
{
"query" : { "match_all" : {} },

                "facets" : {
                  "tags" : {
                    "terms" : {
                        "field" : "qty_onhand",
                        "size"  : "10"
                    }
                  }
                }
              }),
      dataType:"json"
      async: false

,processData: false
}).responseText;

  // Create our data table out of JSON data loaded from server.
  var data = new google.visualization.DataTable(jsonData);

  // Instantiate and draw our chart, passing in some options.
  var chart = new

google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, {width: 400, height: 240});
}

</script>

The issue I'm running into is that the data returned from the query is not
the the "fields", but its the entire query summary, including:

{

  • took: 10
  • timed_out: false
  • _shards: {
    • total: 5
    • successful: 5
    • failed: 0
      }
  • hits: {
    • total: 11
    • max_score: 1
    • hits: [

etc...

Is there a way to return this query while retaining only the fields? Or
perhaps there is a way to query and format the data in a PHP file that I
can then call in the chart?

--
You received this message because you are subscribed to the Google Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elasticsearch+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

2

Can you try with something like:

var data = new google.visualization.DataTable(jsonData.hits.hits);

Does it help?

David :wink:
Twitter : @dadoonet / @elasticsearchfr / @scrutmydocs

Le 4 avr. 2013 à 03:44, OffensivelyBad shawnroller10@gmail.com a écrit :

var data = new google.visualization.DataTable(jsonData);

--
You received this message because you are subscribed to the Google Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elasticsearch+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

3

var jsonData = $.ajax({

It's quite an anti-pattern to use Ajax (and JavaScript) synchronously like
this. You should register a callbak for when your data is loaded.

Other then that, have you looked at the returned JSON response at all? I
can see you're trying to draw a pie chart from the terms facet, which you
named "tags". Do you see a corresponding part of the JSON response? Can you
work with something like jsonData.facets.tags.terms?

By the way, there's an article on the Elasticsearch website about using
facets for
visualization: Elasticsearch Platform — Find real-time answers at scale | Elastic
It's almost two years old, and uses Protovis, and antique framework, but
the patterns and explanations still stand valid.

Karel

--
You received this message because you are subscribed to the Google Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elasticsearch+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

4

I'll give that a shot Karel and David. Thanks.

If that doesn't work, what I'll end up doing is looping through a
javascript function to format the data in a way that Google Charts
recognizes it. Being new to most of this, I'll probably be flooding the
javascript group here pretty soon!

On Thursday, April 4, 2013 3:33:47 AM UTC-4, Karel Minařík wrote:

var jsonData = $.ajax({

It's quite an anti-pattern to use Ajax (and JavaScript) synchronously like
this. You should register a callbak for when your data is loaded.

Other then that, have you looked at the returned JSON response at all? I
can see you're trying to draw a pie chart from the terms facet, which you
named "tags". Do you see a corresponding part of the JSON response? Can you
work with something like jsonData.facets.tags.terms?

By the way, there's an article on the Elasticsearch website about using
facets for visualization:
Elasticsearch Platform — Find real-time answers at scale | Elastic almost two years old, and uses Protovis, and antique framework, but
the patterns and explanations still stand valid.

Karel

--
You received this message because you are subscribed to the Google Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elasticsearch+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.