diff --git a/samples/stacked-bar.html b/samples/stacked-bar.html
index ddeabc4..bf2f36a 100644
--- a/samples/stacked-bar.html
+++ b/samples/stacked-bar.html
@@ -18,7 +18,18 @@
var randomColorFactor = function(){ return Math.round(Math.random()*255)};
var barChartData = {
- labels : ["January","February","March","April","May","June","July"],
+ labels : [
+ {
+ name: "January",
+ additional: "Date 1"
+ },
+ "February",
+ "March",
+ "April",
+ "May",
+ "June",
+ "July"
+ ],
datasets : [
{
fillColor : "rgba(220,220,220,0.5)",
@@ -39,14 +50,23 @@
strokeColor : "rgba(240,73,73,0.8)",
highlightFill : "rgba(240,73,73,0.75)",
highlightStroke : "rgba(240,73,73,1)",
- data : [randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor()]
+ data : [
+ {y:randomScalingFactor(), data: 'Tooltip text'},
+ {y:randomScalingFactor(), data: 'Tooltip text'},
+ {y:randomScalingFactor(), data: 'Tooltip text'},
+ {y:randomScalingFactor(), data: 'Tooltip text'},
+ {y:randomScalingFactor(), data: 'Tooltip text'},
+ {y:randomScalingFactor(), data: 'Tooltip text'},
+ {y:randomScalingFactor(), data: 'Tooltip text'}
+ ]
}
]
};
window.onload = function(){
var ctx = document.getElementById("canvas").getContext("2d");
window.myBar = new Chart(ctx).StackedBar(barChartData, {
- responsive : true
+ responsive : true,
+ multiTooltipTemplate: "<% if(additionalLabel.length>0){ %><%= additionalLabel %><% }else{ %><%= label %><% } %> - <%= value %>"
});
$('#randomizeData').click(function(){
diff --git a/src/Chart.StackedBar.js b/src/Chart.StackedBar.js
index a452f04..b4e4430 100644
--- a/src/Chart.StackedBar.js
+++ b/src/Chart.StackedBar.js
@@ -164,14 +164,26 @@
this.datasets.push(datasetObject);
helpers.each(dataset.data,function(dataPoint,index){
- if(!helpers.isNumber(dataPoint)){
+
+ var additionalLabel = '';
+ var label = data.labels[index];
+ if(!helpers.isNumber(dataPoint) && !helpers.isNumber(dataPoint.y)){
dataPoint = 0;
}
+ if (helpers.isNumber(dataPoint.y)) {
+ additionalLabel = dataPoint.data;
+ dataPoint = dataPoint.y;
+ }
+
+ if (typeof(label) !== 'string') {
+ label = label.additional;
+ }
//Add a new point for each piece of data, passing any required data to draw.
//Add 0 as value if !isNumber (e.g. empty values are useful when 0 values should be hidden in tooltip)
datasetObject.bars.push(new this.BarClass({
value : dataPoint,
- label : data.labels[index],
+ label : label,
+ additionalLabel: additionalLabel,
datasetLabel: dataset.label,
strokeColor : dataset.strokeColor,
fillColor : dataset.fillColor,
@@ -436,6 +448,12 @@
return values;
};
+ for (var i = 0; i < labels.length; i++) {
+ if (typeof(labels[i]) !== 'string') {
+ labels[i] =labels[i].name;
+ }
+ }
+
var scaleOptions = {
templateString : this.options.scaleLabel,
height : this.chart.height,