discourse/app/assets/javascripts/admin/components/admin-graph.js.es6

57 lines
1.2 KiB
Plaintext
Raw Normal View History

2018-06-15 23:03:24 +08:00
import loadScript from "discourse/lib/load-script";
import { number } from "discourse/lib/formatter";
export default Ember.Component.extend({
2018-06-15 23:03:24 +08:00
tagName: "canvas",
refreshChart() {
const ctx = this.$()[0].getContext("2d");
const model = this.get("model");
const rawData = this.get("model.data");
var data = {
labels: rawData.map(r => r.x),
2018-06-15 23:03:24 +08:00
datasets: [
{
data: rawData.map(r => r.y),
label: model.get("title"),
backgroundColor: "rgba(200,220,240,0.3)",
borderColor: "#08C"
}
]
};
const config = {
2018-06-15 23:03:24 +08:00
type: "line",
data: data,
options: {
responsive: true,
tooltips: {
callbacks: {
2018-06-15 23:03:24 +08:00
title: context =>
moment(context[0].xLabel, "YYYY-MM-DD").format("LL")
}
},
scales: {
2018-06-15 23:03:24 +08:00
yAxes: [
{
display: true,
ticks: {
callback: label => number(label),
suggestedMin: 0
}
}
2018-06-15 23:03:24 +08:00
]
}
2018-06-15 23:03:24 +08:00
}
};
2016-04-14 14:30:04 +08:00
this._chart = new window.Chart(ctx, config);
},
2018-06-15 23:03:24 +08:00
didInsertElement() {
loadScript("/javascripts/Chart.min.js").then(() =>
this.refreshChart.apply(this)
);
}
2016-04-14 14:30:04 +08:00
});