Implementing JSON data import

This commit is contained in:
Alexander Baumann 2019-05-07 18:06:34 +02:00
parent b323b0ab45
commit 8c42614520
11 changed files with 347 additions and 253 deletions

1
.gitignore vendored
View File

@ -1,3 +1,4 @@
*.iml *.iml
.idea .idea
.project .project
.vscode

View File

@ -0,0 +1,26 @@
{
"labels": [
"Insgesamt",
"Gruppe 1",
"Gruppe 2",
"Gruppe 3"
],
"data1": [
50,
10,
20,
30
],
"data2": [
30,
5,
20,
5
],
"data3": [
80,
20,
30,
30
]
}

View File

@ -0,0 +1,26 @@
{
"labels": [
"1 Jan",
"2 Jan",
"3 Jan",
"4 Jan",
"5 Jan",
"6 Jan"
],
"data1": [
200,
150,
190,
99,
142,
222
],
"data2": [
434,
300,
324,
198,
349,
353
]
}

View File

@ -0,0 +1,18 @@
{
"labels": [
"8-9",
"9-10",
"10-11",
"11-12",
"12-13",
"13-14"
],
"data1": [
12,
19,
3,
5,
2,
3
]
}

View File

@ -0,0 +1,12 @@
{
"labels": [
"Gruppe 1",
"Gruppe 2",
"Gruppe 3"
],
"data1": [
2055,
816,
953
]
}

View File

@ -0,0 +1,30 @@
{
"labels": [
"Insgesamt",
"Gruppe 1",
"Gruppe 2",
"Gruppe 3"
],
"label1": "Gartengeräte",
"data1": [
150,
50,
50,
50
],
"label2": "Eisenwaren",
"data2": [
120,
10,
80,
30
],
"label3": "Baumaterialien",
"data3": [
200,
102,
53,
45
]
}

View File

@ -1,38 +1,26 @@
var ctx = document.getElementById("flop_articles_chart"); $.ajax({
var flop_articles_chart = new Chart(ctx, { url: 'data/flop_articles.json',
dataType: 'json'
}).done(function (results) {
new Chart(document.getElementById("flop_articles_chart"), {
type: 'horizontalBar', type: 'horizontalBar',
data: { data: {
labels: ['Insgesamt', 'Gruppe 1', 'Gruppe 2', 'Gruppe 3',], labels: results.labels,
datasets: [{ datasets: [{
label: 'Holz', label: 'Holz',
backgroundColor: 'rgba(244, 177, 131, 1)', backgroundColor: 'rgba(244, 177, 131, 1)',
stack: 'Stack 0', stack: 'Stack 0',
data: [ data: results.data1
50,
10,
20,
30
]
}, { }, {
label: 'Eisenwaren', label: 'Eisenwaren',
backgroundColor: 'rgba(255, 217, 102, 1)', backgroundColor: 'rgba(255, 217, 102, 1)',
stack: 'Stack 1', stack: 'Stack 1',
data: [ data: results.data2
30,
5,
20,
5
]
}, { }, {
label: 'Baumaterialien', label: 'Baumaterialien',
backgroundColor: 'rgba(196, 209, 142, 1)', backgroundColor: 'rgba(196, 209, 142, 1)',
stack: 'Stack 2', stack: 'Stack 2',
data: [ data: results.data3
80,
20,
30,
30
]
}] }]
}, },
options: { options: {
@ -56,3 +44,4 @@ var flop_articles_chart = new Chart(ctx, {
} }
} }
}); });
});

View File

@ -1,17 +1,20 @@
var ctx = document.getElementById("overview_chart"); $.ajax({
var overview_chart = new Chart(ctx, { url: 'data/overview.json',
dataType: 'json'
}).done(function (results) {
new Chart(document.getElementById("overview_chart"), {
type: 'line', type: 'line',
data: { data: {
labels: ["1 Jan", "2 Jan", "3 Jan", "4 Jan", "5 Jan", "6 Jan"], labels: results.labels,
datasets: [{ datasets: [{
label: "Warenanzahl", label: "Warenanzahl",
data: [200, 150, 190, 99, 142, 222], data: results.data1,
fill: true, fill: true,
backgroundColor: 'rgba(113, 114, 231, 0.7)', backgroundColor: 'rgba(113, 114, 231, 0.7)',
lineTension: 0, lineTension: 0,
}, { }, {
label: "Einnahmen in €", label: "Einnahmen in €",
data: [434, 300, 324, 198, 349, 353], data: results.data2,
fill: true, fill: true,
backgroundColor: 'rgba(104, 216, 154, 0.8)', backgroundColor: 'rgba(104, 216, 154, 0.8)',
lineTension: 0, lineTension: 0,
@ -52,3 +55,4 @@ var overview_chart = new Chart(ctx, {
} }
} }
}); });
});

View File

@ -1,12 +1,15 @@
var ctx = document.getElementById("shoping_times_chart"); $.ajax({
var shoping_times_chart = new Chart(ctx, { url: 'data/shoping_times.json',
dataType: 'json'
}).done(function (results) {
new Chart(document.getElementById("shoping_times_chart"), {
type: 'bar', type: 'bar',
data: { data: {
labels: ['8-9', '9-10', '10-11', '11-12', '12-13', '13-14'], labels: results.labels,
datasets: [{ datasets: [{
label: 'Anzahl verkaufter Artikel', label: 'Anzahl verkaufter Artikel',
data: [12, 19, 3, 5, 2, 3], data: results.data1,
backgroundColor: [ backgroundColor: [
'rgba(143, 170, 220, 0.9)', 'rgba(143, 170, 220, 0.9)',
'rgba(255, 50, 1, 0.9)', 'rgba(255, 50, 1, 0.9)',
@ -51,3 +54,4 @@ var shoping_times_chart = new Chart(ctx, {
} }
} }
}); });
});

View File

@ -1,13 +1,12 @@
var ctx = document.getElementById("sold_articles_cake"); $.ajax({
var sold_articles_cake = new Chart(ctx, { url: 'data/sold_articles.json',
dataType: 'json'
}).done(function (results) {
new Chart(document.getElementById("sold_articles_cake"), {
type: 'pie', type: 'pie',
data: { data: {
datasets: [{ datasets: [{
data: [ data: results.data1,
2055,
816,
953,
],
backgroundColor: [ backgroundColor: [
'rgba(237, 125, 49, 0.9)', 'rgba(237, 125, 49, 0.9)',
'rgba(255, 192, 0, 0.9)', 'rgba(255, 192, 0, 0.9)',
@ -15,12 +14,7 @@ var sold_articles_cake = new Chart(ctx, {
], ],
label: 'Dataset 1' label: 'Dataset 1'
}], }],
labels: [ labels: results.labels
'Gruppe 1',
'Gruppe 2',
'Gruppe 3',
]
}, },
options: { options: {
responsive: true, responsive: true,
@ -41,3 +35,4 @@ var sold_articles_cake = new Chart(ctx, {
} }
} }
}); });
});

View File

@ -1,38 +1,26 @@
var ctx = document.getElementById("top_articles_chart"); $.ajax({
var top_articles_chart = new Chart(ctx, { url: 'data/top_articles.json',
type: 'horizontalBar', dataType: 'json'
}).done(function (results) {
new Chart(document.getElementById("top_articles_chart"), {
type: 'phorizontalBarie',
data: { data: {
labels: ['Insgesamt', 'Gruppe 1', 'Gruppe 2', 'Gruppe 3',], labels: results.labels,
datasets: [{ datasets: [{
label: 'Gartengeräte', label: results.label1,
backgroundColor: 'rgba(244, 177, 131, 1)', backgroundColor: 'rgba(244, 177, 131, 1)',
stack: 'Stack 0', stack: 'Stack 0',
data: [ data: results.data1
150,
50,
50,
50
]
}, { }, {
label: 'Eisenwaren', label: results.label2,
backgroundColor: 'rgba(255, 217, 102, 1)', backgroundColor: 'rgba(255, 217, 102, 1)',
stack: 'Stack 1', stack: 'Stack 1',
data: [ data: results.data2
120,
10,
80,
30
]
}, { }, {
label: 'Baumaterialien', label: results.label3,
backgroundColor: 'rgba(196, 209, 142, 1)', backgroundColor: 'rgba(196, 209, 142, 1)',
stack: 'Stack 2', stack: 'Stack 2',
data: [ data: results.data3
200,
102,
53,
45
]
}] }]
}, },
options: { options: {
@ -56,3 +44,4 @@ var top_articles_chart = new Chart(ctx, {
} }
} }
}); });
});