Per-controller options

[benmccann]

From discussion with @simonbrunel over Slack:

Mixed charts today don't work well because we have global options instead of per-controller options (see #4587 for more details). A possible solution would be the one below:

When creating / updating a controllers, we should resolve options from:

• dataset.*: per controller/dataset options
• the chart options.*
• the defaults.{datasetType/chartType}.*
• the defaults.global.*

and store the result in a private _config variable in each dataset controller then controllers would not anymore look at the chart.options values only refer to this (the controller)._config

The options cannot always be merged automatically because the names don't match. E.g. global showLines vs. controller/dataset showLine. And pointBackgroundColor vs element.point.backgroundColor

It will be difficult to separate dataset options from attributes like data, _meta, _children and methods like transition and ease that are also defined on the dataset

[benmccann]

Non-matching option names:

DatasetController.xAxisID = scales.xAxes[0].id
DatasetController.yAxisID = scales.yAxes[0].id
LineController.lineTension = elements.line.tension
LineController.steppedLine, elements.line.stepped
LineController.pointRadius, elements.point.radius
LineController.pointHoverRadius, elements.point.hoverRadius
LineController.pointHoverBackgroundColor, elements.point.hoverBackgroundColor
LineController.pointHoverBorderColor, elements.point.hoverBorderColor
LineController.pointHoverBorderWidth, elements.point.hoverBorderWidth
RadarController.lineTension = elements.line.tension
RadarController.pointHitRadius = elements.point.hitRadius
RadarController.pointHoverRadius = elements.point.hoverRadius
RadarController.pointHoverBackgroundColor = elements.point.hoverBackgroundColor
RadarController.pointRadius = elements.point.radius
RadarController.pointBackgroundColor = elements.point.backgroundColor
RadarController.pointBorderColor = elements.point.borderColor
RadarController.pointBorderWidth = elements.point.borderWidth
LegendPlugin.fillStyle = defaultColor
LegendPlugin.strokeStyle = defaultColor

There's also a number with a different amount of nesting:

LineController.backgroundColor = elements.line.backgroundColor
LineController.borderWidth = elements.line.borderWidth
LineController.borderColor = elements.line.borderColor
LineController.borderCapStyle = elements.line.borderCapStyle
LineController.borderDash = elements.line.borderDash
LineController.borderDashOffset = elements.line.borderDashOffset
LineController.borderJoinStyle = elements.line.borderJoinStyle
LineController.fill = elements.line.fill
LineController.cubicInterpolationMode = elements.line.cubicInterpolationMode
RadarController.backgroundColor = elements.line.backgroundColor
RadarController.borderWidth = elements.line.borderWidth
RadarController.borderColor = elements.line.borderColor
RadarController.fill = elements.line.fill
RadarController.borderCapStyle = elements.line.borderCapStyle
RadarController.borderDash = elements.line.borderDash
RadarController.borderDashOffset = elements.line.borderDashOffset
RadarController.borderJoinStyle = elements.line.borderJoinStyle

[benmccann]

Closing as implemented in #5999