本文整理汇总了TypeScript中chartist.Interpolation.cardinal方法的典型用法代码示例。如果您正苦于以下问题:TypeScript Interpolation.cardinal方法的具体用法?TypeScript Interpolation.cardinal怎么用?TypeScript Interpolation.cardinal使用的例子?那么, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类chartist.Interpolation
的用法示例。
在下文中一共展示了Interpolation.cardinal方法的1个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: ngOnInit
ngOnInit() {
/* ----------========== Daily Sales Chart initialization For Documentation ==========---------- */
const dataDailySalesChart: any = {
labels: ['M', 'T', 'W', 'T', 'F', 'S', 'S'],
series: [
[12, 17, 7, 17, 23, 18, 38]
]
};
const optionsDailySalesChart: any = {
lineSmooth: Chartist.Interpolation.cardinal({
tension: 0
}),
low: 0,
high: 50, // creative tim: we recommend you to set the high sa the biggest value + something for a better look
chartPadding: { top: 0, right: 0, bottom: 0, left: 0},
}
var dailySalesChart = new Chartist.Line('#dailySalesChart', dataDailySalesChart, optionsDailySalesChart);
this.startAnimationForLineChart(dailySalesChart);
/* ----------========== Completed Tasks Chart initialization ==========---------- */
const dataCompletedTasksChart: any = {
labels: ['12am', '3pm', '6pm', '9pm', '12pm', '3am', '6am', '9am'],
series: [
[230, 750, 450, 300, 280, 240, 200, 190]
]
};
const optionsCompletedTasksChart: any = {
lineSmooth: Chartist.Interpolation.cardinal({
tension: 0
}),
low: 0,
high: 1000, // creative tim: we recommend you to set the high sa the biggest value + something for a better look
chartPadding: { top: 0, right: 0, bottom: 0, left: 0}
}
var completedTasksChart = new Chartist.Line('#completedTasksChart', dataCompletedTasksChart, optionsCompletedTasksChart);
// start animation for the Completed Tasks Chart - Line Chart
this.startAnimationForLineChart(completedTasksChart);
/* ----------========== Emails Subscription Chart initialization ==========---------- */
var dataEmailsSubscriptionChart = {
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
series: [
[542, 443, 320, 780, 553, 453, 326, 434, 568, 610, 756, 895]
]
};
var optionsEmailsSubscriptionChart = {
axisX: {
showGrid: false
},
low: 0,
high: 1000,
chartPadding: { top: 0, right: 5, bottom: 0, left: 0}
};
var responsiveOptions: any[] = [
['screen and (max-width: 640px)', {
seriesBarDistance: 5,
axisX: {
labelInterpolationFnc: function (value) {
return value[0];
}
}
}]
];
var emailsSubscriptionChart = new Chartist.Bar('#emailsSubscriptionChart', dataEmailsSubscriptionChart, optionsEmailsSubscriptionChart, responsiveOptions);
//start animation for the Emails Subscription Chart
this.startAnimationForBarChart(emailsSubscriptionChart);
}