Skip to content

Commit e5ed663

Browse files
hkulekcihkulekci
committed
added graph examples
1 parent b147bed commit e5ed663

File tree

4 files changed

+294
-4
lines changed

4 files changed

+294
-4
lines changed

‎.docker/kibana/Dockerfile‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,6 @@ FROM docker.elastic.co/kibana/kibana:5.6.2
22

33
ENV ELASTICSEARCH_URL "http://elasticsearch:9200"
44

5+
RUN bin/kibana-plugin remove x-pack
6+
57
EXPOSE 5601:5601

‎routes/graphs.js‎

Lines changed: 60 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,67 @@
11
var express = require('express');
22
var router = express.Router();
3+
var productGraphService = require('../services/productGraphService');
4+
var waterfall = require('async/waterfall');
5+
6+
var dynamicColors = function() {
7+
var r = Math.floor(Math.random() * 255);
8+
var g = Math.floor(Math.random() * 255);
9+
var b = Math.floor(Math.random() * 255);
10+
return "rgb(" + r + "," + g + "," + b + ")";
11+
};
12+
313

414
router.get('/', function(req, res, next) {
5-
res.render('graphs');
15+
16+
waterfall(
17+
[
18+
function(waterfallCallback) {
19+
productGraphService.getProductCountByDate({}, function(err, result) {
20+
if(err) { waterfallCallback(true, {}); }
21+
var colors = [];
22+
for (var i in result['vals']) {
23+
colors.push(dynamicColors());
24+
}
25+
waterfallCallback(false, {"chart1": {'labels':'"' + result['keys'].join('","') + '"', 'datasets': [ {'data': result['vals'].join(','), 'label': 'Num of Product', 'colors': '"'+colors.join('","')+'"'} ]}});
26+
return;
27+
});
28+
},
29+
function(data, waterfallCallback) {
30+
productGraphService.getProductQuantities({}, function(err, result) {
31+
if(err) { waterfallCallback(true, {}); }
32+
var colors = [];
33+
for (var i in result['vals']) {
34+
colors.push(dynamicColors());
35+
}
36+
data['chart2'] = {'labels':'"' + result['keys'].join('","') + '"', 'datasets': [ {'data': result['vals'].join(','), 'label': 'Total Product Quantity', 'colors': '"'+colors.join('","')+'"'}, {'data': result['counts'].join(','), 'label': 'Num of Product'} ]};
37+
waterfallCallback(false, data);
38+
return;
39+
});
40+
},
41+
function(data, waterfallCallback) {
42+
productGraphService.getCategoriyQuantitySum({}, function(err, result) {
43+
if(err) { waterfallCallback(true, {}); }
44+
var colors1 = [];
45+
var colors2 = [];
46+
for (var i in result['vals']) {
47+
colors1.push(dynamicColors());
48+
}
49+
50+
for (var i in result['counts']) {
51+
colors2.push(dynamicColors());
52+
}
53+
data['chart3'] = {'labels':'"' + result['keys'].join('","') + '"', 'datasets': [ {'data': result['vals'].join(','), 'label': 'Total Quantity of Category', 'colors': '"'+colors1.join('","')+'"' }, {'data': result['counts'].join(','), 'label': 'Num of Product by Category', 'colors': '"'+colors2.join('","')+'"'} ]};
54+
waterfallCallback(false, data);
55+
return;
56+
});
57+
}
58+
],
59+
function(err, data) {
60+
if(err) { res.send(500,"Server Error"); return; }
61+
console.log(data);
62+
res.render('graphs', data);
63+
}
64+
);
665
return;
766
});
867

‎services/productGraphService.js‎

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
var db = require('./../libraries/elasticsearch');
2+
3+
exports.getProductCountByDate = function(params, callback) {
4+
body = {
5+
"size": 0,
6+
"aggs": {
7+
"product_counts": {
8+
"date_histogram": {
9+
"field": "created_at",
10+
"interval": "week"
11+
}
12+
}
13+
}
14+
};
15+
16+
db.search({
17+
index: 'products',
18+
type: 'product',
19+
body: body
20+
}).then(function (resp) {
21+
var aggs = resp.aggregations.product_counts.buckets;
22+
var result = {
23+
"keys": [],
24+
"vals": []
25+
};
26+
for (i in aggs) {
27+
result['keys'].push(aggs[i].key_as_string);
28+
result['vals'].push(aggs[i].doc_count);
29+
}
30+
callback(false, result);
31+
return;
32+
}, function (err) {
33+
callback(true);
34+
console.trace(err.message);
35+
return;
36+
});
37+
};
38+
39+
exports.getCategoriyQuantitySum = function(params, callback) {
40+
body = {
41+
"size": 0,
42+
"aggs": {
43+
"product_categories": {
44+
"terms": {
45+
"field": "categories.id",
46+
"size": 10
47+
},
48+
"aggs": {
49+
"sum": {
50+
"sum": {
51+
"field": "quantity"
52+
}
53+
}
54+
}
55+
}
56+
}
57+
};
58+
59+
db.search({
60+
index: 'products',
61+
type: 'product',
62+
body: body
63+
}).then(function (resp) {
64+
var aggs = resp.aggregations.product_categories.buckets;
65+
var result = {
66+
"keys": [],
67+
"vals": [],
68+
"counts": []
69+
};
70+
for (i in aggs) {
71+
result['keys'].push(aggs[i].key);
72+
result['counts'].push(aggs[i].doc_count);
73+
result['vals'].push(aggs[i].sum.value);
74+
}
75+
callback(false, result);
76+
return;
77+
}, function (err) {
78+
callback(true);
79+
console.trace(err.message);
80+
return;
81+
});
82+
};
83+
84+
85+
exports.getProductQuantities = function(params, callback) {
86+
body = {
87+
"size": 0,
88+
"aggs": {
89+
"product_counts": {
90+
"date_histogram": {
91+
"field": "created_at",
92+
"interval": "week"
93+
},
94+
"aggs": {
95+
"product_quantities": {
96+
"sum": {
97+
"field": "quantity"
98+
}
99+
}
100+
}
101+
}
102+
}
103+
};
104+
105+
db.search({
106+
index: 'products',
107+
type: 'product',
108+
body: body
109+
}).then(function (resp) {
110+
var aggs = resp.aggregations.product_counts.buckets;
111+
var result = {
112+
"keys": [],
113+
"vals": [],
114+
"counts": []
115+
};
116+
for (i in aggs) {
117+
result['keys'].push(aggs[i].key_as_string);
118+
result['counts'].push(aggs[i].doc_count);
119+
result['vals'].push(aggs[i].product_quantities.value);
120+
}
121+
callback(false, result);
122+
return;
123+
}, function (err) {
124+
callback(true);
125+
console.trace(err.message);
126+
return;
127+
});
128+
};

‎views/graphs.twig‎

Lines changed: 104 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,109 @@
11
{% extends 'layout.twig' %}
22

33
{% block body %}
4-
<div class="row">
5-
<h1>From Kibana</h1>
6-
<iframe src="http://127.0.0.1:5601/app/kibana#/visualize/edit/c46522a0-a9d5-11e7-aba8-ad0a02c02284?embed=true&_g=(refreshInterval:(display:Off,pause:!f,value:0),time:(from:'2015-11-29T04:09:45.541Z',mode:absolute,to:'2017-10-31T21:00:00.000Z'))&_a=(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(),vis:(aggs:!((enabled:!t,id:'1',params:(field:quantity),schema:metric,type:sum),(enabled:!t,id:'2',params:(field:categories.name.keyword,order:desc,orderBy:'1',size:5),schema:segment,type:terms)),listeners:(),params:(addLegend:!t,addTooltip:!t,isDonut:!f,legendPosition:right),title:'New+Visualization',type:pie))" class="col-6 border-0"></iframe>
4+
<div class="row">
5+
<div class="col-6">
6+
<canvas id="firstChart" height="200"></canvas>
77
</div>
8+
<div class="col-6">
9+
<canvas id="thirdChart" height="200"></canvas>
10+
</div>
11+
<div class="col-6">
12+
<canvas id="secondChart" height="200"></canvas>
13+
</div>
14+
<div class="col-6">
15+
<canvas id="fourthChart" height="200"></canvas>
16+
</div>
17+
</div>
18+
19+
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.min.js"></script>
20+
<script type="text/javascript">
21+
22+
var data1 = {
23+
labels: [{{chart1['labels']}}],
24+
datasets: [
25+
{% for dataset in chart1['datasets'] %}
26+
{
27+
label: '{{dataset['label']}}',
28+
data: [{{dataset['data']}}],
29+
backgroundColor: [{{dataset['colors']}}],
30+
borderWidth: 1
31+
}
32+
{% endfor %}
33+
]
34+
};
35+
36+
var ctx = document.getElementById("firstChart");
37+
var firstChart = new Chart(ctx, {
38+
type: 'bar',
39+
data: data1,
40+
options: {
41+
responsive: true,
42+
scales: {
43+
yAxes: [
44+
{
45+
ticks: {
46+
beginAtZero:true
47+
}
48+
}
49+
]
50+
}
51+
}
52+
});
53+
54+
var data2 = {
55+
labels: [{{chart2['labels']}}],
56+
datasets: [
57+
{% for dataset in chart2['datasets'] %}
58+
{
59+
label: '{{dataset['label']}}',
60+
data: [{{dataset['data']}}],
61+
borderWidth: 1
62+
},
63+
{% endfor %}
64+
]
65+
};
66+
67+
var ctx = document.getElementById("secondChart");
68+
var secondChart = new Chart(ctx, {
69+
type: 'line',
70+
data: data2,
71+
options: {
72+
responsive: true,
73+
scales: {
74+
yAxes: [
75+
{
76+
ticks: {
77+
beginAtZero:true
78+
}
79+
}
80+
]
81+
}
82+
}
83+
});
84+
85+
var data3 = {
86+
labels: [{{chart3['labels']}}],
87+
datasets: [
88+
{% for dataset in chart3['datasets'] %}
89+
{
90+
label: '{{dataset['label']}}',
91+
data: [{{dataset['data']}}],
92+
backgroundColor: [{{dataset['colors']}}],
93+
borderWidth: 1
94+
},
95+
{% endfor %}
96+
]
97+
};
98+
99+
var ctx = document.getElementById("thirdChart");
100+
var thirdChart = new Chart(ctx, {
101+
type: 'pie',
102+
data: data3,
103+
options: {
104+
responsive: true
105+
}
106+
});
107+
108+
</script>
8109
{% endblock %}

0 commit comments

Comments
 (0)