From: Zach Panzarino <zachary@panzarino.com>
Date: Wed, 10 Aug 2016 00:12:56 +0000 (+0000)
Subject: Merge 'Documentation updates' #3110
X-Git-Tag: v2.2.2~14
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=6e9ee1f137828fe68a567c35a4d89ce38d770de1;p=thirdparty%2FChart.js.git

Merge 'Documentation updates' #3110
---

6e9ee1f137828fe68a567c35a4d89ce38d770de1
diff --cc docs/01-Chart-Configuration.md
index 90f1efd87,a6d62480e..7eef8c827
--- a/docs/01-Chart-Configuration.md
+++ b/docs/01-Chart-Configuration.md
@@@ -426,23 -425,34 +427,52 @@@ img.onload = function() 
          }
      })
  }
 +```
 +
 +Using pattern fills for data graphics can help viewers with vision deficiencies (e.g. color-blindness or partial sight) to [more easily understand your data](http://betweentwobrackets.com/data-graphics-and-colour-vision/).
  
 +Using the [Patternomaly](https://github.com/ashiguruma/patternomaly) library you can generate patterns to fill datasets.
 +
 +```javascript
 +var chartData = {
 +	datasets: [{
 +		data: [45, 25, 20, 10],
 +		backgroundColor: [
 +			pattern.draw('square', '#ff6384'),
 +			pattern.draw('circle', '#36a2eb'),
 +			pattern.draw('diamond', '#cc65fe'),
 +			pattern.draw('triangle', '#ffce56'),
 +		]
 +	}],
 +	labels: ['Red', 'Blue', 'Purple', 'Yellow']
 +};
  ```
+ 
+ ### Mixed Chart Types
+ 
+ When creating a chart, you have the option to overlay different chart types on top of eachother as separate datasets.
+ 
+ To do this, you must set a `type` for each dataset individually. You can create mixed chart types with bar and line chart types.
+ 
+ When creating the chart you must set the overall `type` as `bar`.
+ 
+ ```javascript
+ var myChart = new Chart(ctx, {
+     type: 'bar',
+     data: {
+         labels: ['Item 1', 'Item 2', 'Item 3'],
+         datasets: [
+             {
+                 type: 'bar',
+                 label: 'Bar Component',
+                 data: [10, 20, 30],
+             },
+             {
+                 type: 'line',
+                 label: 'Line Component',
+                 data: [30, 20, 10],
+             }
+         ]
+     }
+ });
+ ```