Individual chart options may also override global options

This commit is contained in:
Andrew Fong
2015-11-25 02:05:27 +00:00
parent b2d17b5dad
commit ba1ba6fdeb
2 changed files with 74 additions and 45 deletions

View File

@@ -325,7 +325,7 @@ var myDoughnutChart = new Chart(ctx).Doughnut(pieData, {
animateRotate: true,
animateScale: false,
legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].fillColor%>\"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>"
});
});
var myDoughnutChartLegend: string = myDoughnutChart.generateLegend();
var myDoughnutChartImage: string = myDoughnutChart.toBase64Image();
@@ -341,3 +341,32 @@ myDoughnutChart.resize();
myDoughnutChart.update();
myDoughnutChart.stop();
myDoughnutChart.destroy();
// Test using charts with overrides of a subset of global options
var partialOpts: ChartSettings = {
showTooltips: true,
tooltipEvents: ["mousemove", "touchstart", "touchmove"],
tooltipFillColor: "rgba(0,0,0,0.8)",
tooltipFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
tooltipFontSize: 14,
tooltipFontStyle: "normal",
tooltipFontColor: "#fff",
tooltipTitleFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
tooltipTitleFontSize: 14,
tooltipTitleFontStyle: "bold",
tooltipTitleFontColor: "#fff",
tooltipYPadding: 6,
tooltipXPadding: 6,
tooltipCaretSize: 8,
tooltipCornerRadius: 6,
tooltipXOffset: 10,
tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>"
};
var my2ndLineChart = new Chart(ctx).Line(lineData, partialOpts);
var my2ndBarChart = new Chart(ctx).Bar(barData, partialOpts);
var my2ndRadarChart = new Chart(ctx).Radar(radarData, partialOpts);
var my2ndPolarAreaChart = new Chart(ctx).PolarArea(polarAreaData, partialOpts);
var my2ndPieChart = new Chart(ctx).Pie(pieData, partialOpts);
var my2ndDoughnutChart = new Chart(ctx).Doughnut(pieData, partialOpts);

88
chartjs/chart.d.ts vendored
View File

@@ -33,49 +33,49 @@ interface CircularChartData {
}
interface ChartSettings {
animation: boolean;
animationSteps: number;
animationEasing: string;
showScale: boolean;
scaleOverride: boolean;
scaleSteps: number;
scaleStepWidth: number;
scaleStartValue: number;
scaleLineColor: string;
scaleLineWidth: number;
scaleShowLabels: boolean;
scaleLabel: string;
scaleIntegersOnly: boolean;
scaleBeginAtZero: boolean;
scaleFontFamily: string;
scaleFontSize: number;
scaleFontStyle: string;
scaleFontColor: string;
responsive: boolean;
maintainAspectRatio: boolean;
showTooltips: boolean;
tooltipEvents: string[];
tooltipFillColor: string;
tooltipFontFamily: string;
tooltipFontSize: number;
tooltipFontStyle: string;
tooltipFontColor: string;
tooltipTitleFontFamily: string;
tooltipTitleFontSize: number;
tooltipTitleFontStyle: string;
tooltipTitleFontColor: string;
tooltipYPadding: number;
tooltipXPadding: number;
tooltipCaretSize: number;
tooltipCornerRadius: number;
tooltipXOffset: number;
tooltipTemplate: string;
multiTooltipTemplate: string;
onAnimationProgress: () => any;
onAnimationComplete: () => any;
animation?: boolean;
animationSteps?: number;
animationEasing?: string;
showScale?: boolean;
scaleOverride?: boolean;
scaleSteps?: number;
scaleStepWidth?: number;
scaleStartValue?: number;
scaleLineColor?: string;
scaleLineWidth?: number;
scaleShowLabels?: boolean;
scaleLabel?: string;
scaleIntegersOnly?: boolean;
scaleBeginAtZero?: boolean;
scaleFontFamily?: string;
scaleFontSize?: number;
scaleFontStyle?: string;
scaleFontColor?: string;
responsive?: boolean;
maintainAspectRatio?: boolean;
showTooltips?: boolean;
tooltipEvents?: string[];
tooltipFillColor?: string;
tooltipFontFamily?: string;
tooltipFontSize?: number;
tooltipFontStyle?: string;
tooltipFontColor?: string;
tooltipTitleFontFamily?: string;
tooltipTitleFontSize?: number;
tooltipTitleFontStyle?: string;
tooltipTitleFontColor?: string;
tooltipYPadding?: number;
tooltipXPadding?: number;
tooltipCaretSize?: number;
tooltipCornerRadius?: number;
tooltipXOffset?: number;
tooltipTemplate?: string;
multiTooltipTemplate?: string;
onAnimationProgress?: () => any;
onAnimationComplete?: () => any;
}
interface ChartOptions {
interface ChartOptions extends ChartSettings {
scaleShowGridLines?: boolean;
scaleGridLineColor?: string;
scaleGridLineWidth?: number;
@@ -138,7 +138,7 @@ interface BarChartOptions extends ChartOptions {
barDatasetSpacing?: number;
}
interface RadarChartOptions {
interface RadarChartOptions extends ChartSettings {
scaleShowLine?: boolean;
angleShowLineOut?: boolean;
scaleShowLabels?: boolean;
@@ -159,7 +159,7 @@ interface RadarChartOptions {
legendTemplate?: string;
}
interface PolarAreaChartOptions {
interface PolarAreaChartOptions extends ChartSettings {
scaleShowLabelBackdrop?: boolean;
scaleBackdropColor?: string;
scaleBeginAtZero?: boolean;
@@ -176,7 +176,7 @@ interface PolarAreaChartOptions {
legendTemplate?: string;
}
interface PieChartOptions {
interface PieChartOptions extends ChartSettings {
segmentShowStroke?: boolean;
segmentStrokeColor?: string;
segmentStrokeWidth?: number;