I'm attempting to import data from elastic search via an Ajax command that
runs a query. I then attempt to format the returned JSON document to the
standards Google Charts requires, as follows:
{
"cols": [
{"id":"","label":"Lane","type":"string"},
{"id":"","label":"Routes","type":"number"}
],
"rows": [
{"c":[{"v":"M01"},{"v":4657}]},
{"c":[{"v":"M02"},{"v":4419}]},
{"c":[{"v":"M03"},{"v":4611}]},
{"c":[{"v":"M04"},{"v":4326}]},
{"c":[{"v":"M05"},{"v":4337}]},
{"c":[{"v":"M06"},{"v":5363}]}
]
}
The data that my query returns is as follows:
{
"took" : 2,
"timed_out" : false,
"_shards" : {
"total" : 5,
"successful" : 5,
"failed" : 0
},
"hits" : {
"total" : 7,
"max_score" : 1.0,
"hits" : [ {
"_index" : "wcs",
"_type" : "routes",
"_id" : "4",
"_score" : 1.0, "_source" : {"lane":"M04","routes":"102"}
}, {
"_index" : "wcs",
"_type" : "routes",
"_id" : "5",
"_score" : 1.0, "_source" : {"lane":"M03","routes":"143"}
}, {
"_index" : "wcs",
"_type" : "routes",
"_id" : "1",
"_score" : 1.0, "_source" : {"lane":"M07","routes":"80"}
}, {
"_index" : "wcs",
"_type" : "routes",
"_id" : "6",
"_score" : 1.0, "_source" : {"lane":"M02","routes":"157"}
}, {
"_index" : "wcs",
"_type" : "routes",
"_id" : "2",
"_score" : 1.0, "_source" : {"lane":"M06","routes":"101"}
}, {
"_index" : "wcs",
"_type" : "routes",
"_id" : "7",
"_score" : 1.0, "_source" : {"lane":"M01","routes":"105"}
}, {
"_index" : "wcs",
"_type" : "routes",
"_id" : "3",
"_score" : 1.0, "_source" : {"lane":"M05","routes":"160"}
} ]
}
}
<html>
<head>
<script type="text/javascript"
src="https://www.google.com/jsapi";></script>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";></script>
<script type="text/javascript">
google.load('visualization', '1', {'packages':['corechart']});
google.setOnLoadCallback(drawChart);
//query the server
function drawChart() {
var jsonData = $.ajax({
url: 'http://localhost:9200/wcs/routes/_search?pretty=true'
, type: 'POST'
, data :
JSON.stringify(
{
"query" : { "match_all" : {} }
})
, dataType : 'json'
async: false
});
var json = JSON.parse(jsonData);
//format the JSON document into rows and cols:
var jdata = '{ "cols": [{"id":"", "label":"lane", "type": "string"},' +
'{"id": "", "label": "routes", "type": "number"}],' + '"rows":[{"c":
[{"v":' + json.hits[0].hits[0]._source.lane + '},{"v":' +
json.hits[0].hits[0]._source.routes + '}]}]';
var data = new google.visualization.DataTable(jdata);
var chart = new
google.visualization.PieChart(document.getElementById('piechart_div'));
chart.draw(data, {is3D: true, title: 'Multi Routes per Lane', width:
600, height: 440});
}
</script>
</head>
<body>
<input type="button" onclick = "drawChart()" value="test">
<div id="piechart_div"> </div>
</body>
</html>
--
You received this message because you are subscribed to the Google Groups
"Google Chart API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-chart-api?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
