Skip to content

Commit

Permalink
updated sample graphs
Browse files Browse the repository at this point in the history
  • Loading branch information
maxwondercorn committed Oct 31, 2018
1 parent 9327906 commit 0dce973
Show file tree
Hide file tree
Showing 12 changed files with 345 additions and 230 deletions.
33 changes: 22 additions & 11 deletions tests/dummy/app/controllers/donut.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@ import Controller from '@ember/controller';

export default Controller.extend({

chart: null,
legendVisible: true,
lbuttonText: "Hide Legend",

init() {
this._super(...arguments);

Expand Down Expand Up @@ -42,19 +46,26 @@ export default Controller.extend({
['data1', 30],
['data2', 120],
],
type: 'donut',
onclick: function (d, i) {
console.log("onclick", d, i);
},
onmouseover: function (d, i) {
console.log("onmouseover", d, i);
},
onmouseout: function (d, i) {
console.log("onmouseout", d, i);
}
type: 'donut'
},

donut: { title: "Iris Petal Width" }
title: { text: "Iris data from R" },

donut: { title: "Iris Petal Width" },

padding: { top: 20 },

actions: {
toggleLegend() {
let c = this.get("chart");
this.toggleProperty('legendVisible');
let v= this.get("legendVisible");
let t = v ? "Hide Legend" : "Show Legend";
this.set("lbuttonText", t);

if (v) c.legend.show();
else c.legend.hide();
}
}

});
63 changes: 40 additions & 23 deletions tests/dummy/app/controllers/events.js
Original file line number Diff line number Diff line change
@@ -1,38 +1,55 @@
import Controller from '@ember/controller';
import { computed } from '@ember/object';
import { bind } from '@ember/runloop';
import Controller from "@ember/controller";
import { computed } from "@ember/object";
import { bind } from "@ember/runloop";
/* eslint ember/avoid-leaking-state-in-ember-objects: "off" */

export default Controller.extend({
message: null,
hover: null,

data: computed('model', function () {
chart: null,
legendVisible: true,
lbuttonText: "Hide Legend",

data: computed(function() {
// iris data from R
return {
columns: this.get('model'),
type: 'bar',
types: {
data3: 'spline',
data4: 'line',
},
groups: [
['data1', 'data2']
columns: [
["data1", 30],
["data2", 120],
["data3", 10],
["data4", 45],
["data5", 90]
],

type: "pie",
// https://balinterdi.com/blog/ember-dot-run-dot-bind/
onclick: bind(this, this.get('actions.myClick')),
onmouseover: bind(this, this.get('actions.myMouseover'))
}
onclick: bind(this, this.get("actions.myClick")),
onmouseover: bind(this, this.get("actions.myMouseover"))
};
}),

padding: { top: 20 },

title: { text: "Click data 5 to Win!" },

actions: {
myClick(d, i) {
this.set('message', `${d.name}, value: ${d.value}`);
if (d.name == 'data5')
alert(`Data 5 - you're a winner`);
myClick(d /* i */) {
this.set("message", `${d.name}, value: ${d.value}`);
if (d.name == "data5") alert(`Data 5 - you're a winner`);
},

myMouseover(d /* i */) {
this.set("hover", `${d.name}, value: ${d.value}`);
},

toggleLegend() {
let c = this.get("chart");
this.toggleProperty('legendVisible');
let v= this.get("legendVisible");
let t = v ? "Hide Legend" : "Show Legend";
this.set("lbuttonText", t);

myMouseover(d, i) {
this.set('hover', `${d.name}, value: ${d.value}`);
if (v) c.legend.show();
else c.legend.hide();
}
}
});
35 changes: 24 additions & 11 deletions tests/dummy/app/controllers/gauge.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@ import Controller from '@ember/controller';

export default Controller.extend({

chart: null,
legendVisible: true,
lbuttonText: "Hide Legend",

init: function() {
this._super(...arguments);

Expand Down Expand Up @@ -48,26 +52,35 @@ export default Controller.extend({
columns: [
['data', 91.4]
],
type: 'gauge',
onclick: function(d, i) {
console.log("onclick", d, i);
},
onmouseover: function(d, i) {
console.log("onmouseover", d, i);
},
onmouseout: function(d, i) {
console.log("onmouseout", d, i);
}
type: 'gauge'
},

// the three color levels for the percentage values
color: {
pattern: ['#FF0000', '#F97600', '#F6C600', '#60B044'], // the three color levels for the percentage values.
pattern: ['#FF0000', '#F97600', '#F6C600', '#60B044'],
threshold: {
values: [30, 60, 90, 100]
}
},
size: {
height: 180
},

title: { text: "Percent complete"},

padding: { top: 20 },

actions: {
toggleLegend() {
let c = this.get("chart");
this.toggleProperty('legendVisible');
let v= this.get("legendVisible");
let t = v ? "Hide Legend" : "Show Legend";
this.set("lbuttonText", t);

if (v) c.legend.show();
else c.legend.hide();
}
}

});
39 changes: 29 additions & 10 deletions tests/dummy/app/controllers/pie.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,10 @@ import { computed } from '@ember/object';

export default Controller.extend({

chart: null,
legendVisible: true,
lbuttonText: "Hide Legend",

init: function () {
this._super(...arguments);

Expand Down Expand Up @@ -38,24 +42,39 @@ export default Controller.extend({
1500);
},

data: computed(function() {
// iris data from R
return {
// iris data from R
data: {
columns: [
['data1', 30],
['data2', 120],
],
type: 'pie',
onclick: bind(this, this.get('actions.myClick')),
onmouseover: bind(this, function(d, i) {
console.log("onmouseover", d, i);
})
}
}),
// onclick: bind(this, get(this, 'actions.myClick')),
// onmouseover: bind(this, function(d, i) {
// console.log("onmouseover", d, i);
// })
},

title: { text: "Iris data from R"},

padding: { top: 20 },

onclick: computed(() => bind(this, this.get('actions.myClick'))),

actions: {
myClick(d, i) {
myClick(d, /*i */) {
alert(`clicked ${d.name}`)
},

toggleLegend() {
let c = this.get("chart");
this.toggleProperty('legendVisible');
let v= this.get("legendVisible");
let t = v ? "Hide Legend" : "Show Legend";
this.set("lbuttonText", t);

if (v) c.legend.show();
else c.legend.hide();
}
}

Expand Down
65 changes: 45 additions & 20 deletions tests/dummy/app/controllers/timeseries.js
Original file line number Diff line number Diff line change
@@ -1,41 +1,66 @@
import { later } from '@ember/runloop';
import Controller from '@ember/controller';
import { later } from "@ember/runloop";
import Controller from "@ember/controller";
/* eslint ember/avoid-leaking-state-in-ember-objects: "off" */

export default Controller.extend({

chart: null,
legendVisible: true,
lbuttonText: "Hide Legend",

init() {
this._super(...arguments);

later(this, function () {
this.get('data.columns').push(
['data3', 400, 500, 450, 700, 600, 500]
);
this.notifyPropertyChange('data');
}, 1000);

later(
this,
function() {
this.get("data.columns").push(["data3", 400, 500, 450, 700, 600, 500]);
this.notifyPropertyChange("data");
},
1000
);
},

data: {
x: 'x',
// xFormat: '%Y%m%d', // 'xFormat' can be used as custom format of 'x'
x: "x",
columns: [
['x', '2013-01-01', '2013-01-02', '2013-01-03', '2013-01-04',
'2013-01-05', '2013-01-06'
[
"x",
"2013-01-01",
"2013-01-02",
"2013-01-03",
"2013-01-04",
"2013-01-05",
"2013-01-06"
],
// ['x', '20130101', '20130102', '20130103', '20130104', '20130105', '20130106'],
['data1', 30, 200, 100, 400, 150, 250],
['data2', 130, 340, 200, 500, 250, 350]
["data1", 30, 200, 100, 400, 150, 250],
["data2", 130, 340, 200, 500, 250, 350]
]
},

axis: {
x: {
type: 'timeseries',
type: "timeseries",
tick: {
format: '%Y-%m-%d'
format: "%Y-%m-%d"
}
}
}
},

title: { text: "Downloads by Day" },

});
padding: { top: 20 },

actions: {
toggleLegend() {
let c = this.get("chart");
this.toggleProperty("legendVisible");
let v = this.get("legendVisible");
let t = v ? "Hide Legend" : "Show Legend";
this.set("lbuttonText", t);

if (v) c.legend.show();
else c.legend.hide();
}
}
});
Loading

0 comments on commit 0dce973

Please sign in to comment.