本文整理汇总了TypeScript中chart.js.Chart.destroy方法的典型用法代码示例。如果您正苦于以下问题:TypeScript js.Chart.destroy方法的具体用法?TypeScript js.Chart.destroy怎么用?TypeScript js.Chart.destroy使用的例子?那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类chart.js.Chart
的用法示例。
在下文中一共展示了js.Chart.destroy方法的4个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: createChart
private createChart() {
if (this.chart) {
this.chart.destroy();
}
if (this.canvas) {
const ctx = this.canvas.nativeElement;
this.chart = new Chart(ctx, this.configuration);
}
}
示例2: draw
draw(sum: number) {
const labels = [];
const colors = [];
const dataSet1 = [];
let rest = 0;
this.categories.getData().forEach((cat: Category) => {
if (cat.name != CategoryList.INCOME) {
const amount = Math.abs(cat.amount);
const perCent = 100 * amount / sum;
if (perCent > 3) {
labels.push(cat.name);
dataSet1.push(amount.toFixed(2));
colors.push(cat.color);
} else {
rest += amount;
}
}
});
labels.push('Rest');
dataSet1.push(rest.toFixed(2));
const data = {
labels: labels,
datasets: [
{
data: dataSet1,
backgroundColor: colors,
hoverBackgroundColor: colors,
}
]
};
// console.log(labels, dataSet1);
if (this.myPieChart) {
this.myPieChart.destroy();
}
const canvas = document.getElementById('pieChart');
// console.log(canvas, canvas.style.display);
// console.log(canvas.parentElement);
canvas.style.display = 'block';
canvas.parentElement.style.display = 'block';
this.myPieChart = new Chart(canvas, {
type: 'pie',
data: data,
options: {
legend: {
display: false,
},
animation: {
duration: 0
},
},
});
}
示例3: ngOnDestroy
ngOnDestroy() {
if (this.chart) {
this.chart.destroy();
}
}
示例4: renderLineChart
renderLineChart(lineChart: number) {
if (this.myChart) {
this.myChart.destroy();
}
var canvas = this.element;
var ctx = canvas.getContext('2d');
var dataValues = [];
var labels = [];
var agg = 0;
for (let i = 1; i <= 52; i++) {
dataValues.push(agg);
labels.push("" + i);
agg += lineChart;
}
var data = {
labels: labels,
datasets: [
{
label: "Your Savings",
fill: false,
lineTension: 0.1,
backgroundColor: "rgba(75,192,192,0.4)",
borderColor: "rgba(75,192,192,1)",
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: "rgba(75,192,192,1)",
pointBackgroundColor: "#fff",
pointBorderWidth: 1,
pointHoverRadius: 5,
pointHoverBackgroundColor: "rgba(75,192,192,1)",
pointHoverBorderColor: "rgba(220,220,220,1)",
pointHoverBorderWidth: 2,
pointRadius: 1,
pointHitRadius: 10,
data: dataValues
}
],
};
var _options = {
scales: {
xAxes: [{
gridLines: {
display:false
},
scaleLabel: {
display: true,
labelString: 'Weeks'
}
}],
yAxes: [{
gridLines: {
display:false
},
scaleLabel: {
display: true,
labelString: 'Savings (£)'
}
}]
}
};
this.myChart = new Chart(ctx, {
type: 'line',
data: data,
options: _options
});
}