update document about options update

docs/developers/updates.md

@@ -1,6 +1,6 @@
 # Updating Charts
 
-It's pretty common to want to update charts after they've been created. When the chart data is changed, Chart.js will animate to the new data values. 
+It's pretty common to want to update charts after they've been created. When the chart data or options are changed, Chart.js will animate to the new data values and options.
 
 ## Adding or Removing Data
 
@@ -14,9 +14,7 @@ function addData(chart, label, data) {
     });
     chart.update();
 }
-```
 
-```javascript
 function removeData(chart) {
     chart.data.labels.pop();
     chart.data.datasets.forEach((dataset) => {
@@ -26,6 +24,68 @@ function removeData(chart) {
 }
 ```
 
+## Opdating Options
+
+To update the options, mutating the options property inplace or passing in a new options object are supported.
+
+- If the options are mutated inplace, other option properties would be preserved.
+- If created as a new object, it would be like creating a new chart with the options - old options would be discarded.
+
+```javascript
+function updateConfigByMutating(chart) {
+    chart.options.title.text = 'new title';
+    chart.update();
+}
+
+function updateConfigAsNewObject(chart) {
+    chart.options = {
+        responsive: true,
+        title:{
+            display:true,
+            text: 'Chart.js'
+        },
+        scales: {
+            xAxes: [{
+                display: true
+            }],
+            yAxes: [{
+                display: true
+            }]
+        }
+    }
+    chart.update();
+}
+```
+
+Scales can be updated separately without changing other options.
+To update the scales, pass in an object containing all the customization including those unchanged ones.
+
+Variables referencing any one from `chart.scales` would be lost after updating scales with a new id or the changed type.
+
+```javascript
+function updateScales(chart) {
+    var xScale = chart.scales['x-axis-0'];
+    var yScale = chart.scales['y-axis-0'];
+    chart.options.scleas = {
+        xAxes: [{
+            // omitting id will generate 'x-axis-0'
+            display: true
+        }],
+        yAxes: [{
+            id: 'newId'
+            display: true,
+            type: 'logarithmic'
+        }]
+    }
+    chart.update();
+    // need to update the refernce
+    yScale = chart.scales.newId;
+}
+```
+
+
+Code sample for updating options can be found in [toggle-scale-type.html](../../samples/scales/toggle-scale-type.html).
+
 ## Preventing Animations
 
 Sometimes when a chart updates, you may not want an animation. To achieve this you can call `update` with a duration of `0`. This will render the chart synchronously and without an animation.