Mixing
Dealing with Morris Chart
so I'm trying to build a line chart using Morris Charts that will display tickets count according to ticket status among the year.
The problem is that I got a little confused about xKey and what goes there.
Image explaining what i'm trying to do
Instead i'm getting two lines, one for status and the other for count
data
{period: "2010-09", status: 1, count: 20}
,{period: "2010-10", status: 1, count: 50}
,{period: "2010-10", status: 2, count: 34}
,{period: "2010-11", status: 2, count: 70}
Code
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['count','status']
, labels: ['processing', 'done']
});
I know I'm messing something up but i can't find out what.
javascript morris.js
asked Nov 20 '18 at 18:59
Aboud JoudaAboud Jouda
306
add a comment |
so I'm trying to build a line chart using Morris Charts that will display tickets count according to ticket status among the year.
The problem is that I got a little confused about xKey and what goes there.
Image explaining what i'm trying to do
Instead i'm getting two lines, one for status and the other for count
data
{period: "2010-09", status: 1, count: 20}
,{period: "2010-10", status: 1, count: 50}
,{period: "2010-10", status: 2, count: 34}
,{period: "2010-11", status: 2, count: 70}
Code
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['count','status']
, labels: ['processing', 'done']
});
I know I'm messing something up but i can't find out what.
javascript morris.js
asked Nov 20 '18 at 18:59
Aboud JoudaAboud Jouda
306
add a comment |
so I'm trying to build a line chart using Morris Charts that will display tickets count according to ticket status among the year.
The problem is that I got a little confused about xKey and what goes there.
Image explaining what i'm trying to do
Instead i'm getting two lines, one for status and the other for count
data
{period: "2010-09", status: 1, count: 20}
,{period: "2010-10", status: 1, count: 50}
,{period: "2010-10", status: 2, count: 34}
,{period: "2010-11", status: 2, count: 70}
Code
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['count','status']
, labels: ['processing', 'done']
});
I know I'm messing something up but i can't find out what.
javascript morris.js
asked Nov 20 '18 at 18:59
Aboud JoudaAboud Jouda
306
so I'm trying to build a line chart using Morris Charts that will display tickets count according to ticket status among the year.
The problem is that I got a little confused about xKey and what goes there.
Image explaining what i'm trying to do
Instead i'm getting two lines, one for status and the other for count
data
{period: "2010-09", status: 1, count: 20}
,{period: "2010-10", status: 1, count: 50}
,{period: "2010-10", status: 2, count: 34}
,{period: "2010-11", status: 2, count: 70}
Code
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['count','status']
, labels: ['processing', 'done']
});
I know I'm messing something up but i can't find out what.
javascript morris.js
javascript morris.js
asked Nov 20 '18 at 18:59
Aboud JoudaAboud Jouda
306
asked Nov 20 '18 at 18:59
Aboud JoudaAboud Jouda
306
asked Nov 20 '18 at 18:59
Aboud JoudaAboud Jouda
306
asked Nov 20 '18 at 18:59
Aboud JoudaAboud Jouda
306
asked Nov 20 '18 at 18:59
Aboud JoudaAboud Jouda
306
306
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
You should change your data like that:
{period: "2010-09", status1Count: 20, status2Count: 12}
,{period: "2010-10", status1Count: 50, status2Count: 34}
,{period: "2010-11", status1Count: 70, status2Count: 25}
and chart codes:
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['status1Count','status2Count']
, labels: ['processing', 'done']
});
answered Nov 20 '18 at 19:48
akcobanakcoban
42119
Thank you very much, I was about to lose my mind :)
– Aboud Jouda
Nov 20 '18 at 21:22
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53399795%2fdealing-with-morris-chart%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You should change your data like that:
{period: "2010-09", status1Count: 20, status2Count: 12}
,{period: "2010-10", status1Count: 50, status2Count: 34}
,{period: "2010-11", status1Count: 70, status2Count: 25}
and chart codes:
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['status1Count','status2Count']
, labels: ['processing', 'done']
});
answered Nov 20 '18 at 19:48
akcobanakcoban
42119
Thank you very much, I was about to lose my mind :)
– Aboud Jouda
Nov 20 '18 at 21:22
add a comment |
You should change your data like that:
{period: "2010-09", status1Count: 20, status2Count: 12}
,{period: "2010-10", status1Count: 50, status2Count: 34}
,{period: "2010-11", status1Count: 70, status2Count: 25}
and chart codes:
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['status1Count','status2Count']
, labels: ['processing', 'done']
});
answered Nov 20 '18 at 19:48
akcobanakcoban
42119
Thank you very much, I was about to lose my mind :)
– Aboud Jouda
Nov 20 '18 at 21:22
add a comment |
You should change your data like that:
{period: "2010-09", status1Count: 20, status2Count: 12}
,{period: "2010-10", status1Count: 50, status2Count: 34}
,{period: "2010-11", status1Count: 70, status2Count: 25}
and chart codes:
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['status1Count','status2Count']
, labels: ['processing', 'done']
});
answered Nov 20 '18 at 19:48
akcobanakcoban
42119
You should change your data like that:
{period: "2010-09", status1Count: 20, status2Count: 12}
,{period: "2010-10", status1Count: 50, status2Count: 34}
,{period: "2010-11", status1Count: 70, status2Count: 25}
and chart codes:
Morris.Area({
element: 'morris-area-chart'
, data: data
, xkey: 'period'
, ykeys: ['status1Count','status2Count']
, labels: ['processing', 'done']
});
answered Nov 20 '18 at 19:48
akcobanakcoban
42119
answered Nov 20 '18 at 19:48
akcobanakcoban
42119
answered Nov 20 '18 at 19:48
akcobanakcoban
42119
answered Nov 20 '18 at 19:48
akcobanakcoban
42119
42119
Thank you very much, I was about to lose my mind :)
– Aboud Jouda
Nov 20 '18 at 21:22
add a comment |
Thank you very much, I was about to lose my mind :)
– Aboud Jouda
Nov 20 '18 at 21:22
Thank you very much, I was about to lose my mind :)
– Aboud Jouda
Nov 20 '18 at 21:22
Thank you very much, I was about to lose my mind :)
– Aboud Jouda
Nov 20 '18 at 21:22
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53399795%2fdealing-with-morris-chart%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
