| commit | author | age | ||
| 83c3f6 | 1 | # Scatter Chart |
| SP | 2 | |
| 3 | Scatter charts are based on basic line charts with the x axis changed to a linear axis. To use a scatter chart, data must be passed as objects containing X and Y properties. The example below creates a scatter chart with 3 points. | |
| 4 | ||
| 5 | ```javascript | |
| 6 | var scatterChart = new Chart(ctx, { | |
| 7 | type: 'scatter', | |
| 8 | data: { | |
| 9 | datasets: [{ | |
| 10 | label: 'Scatter Dataset', | |
| 11 | data: [{ | |
| 12 | x: -10, | |
| 13 | y: 0 | |
| 14 | }, { | |
| 15 | x: 0, | |
| 16 | y: 10 | |
| 17 | }, { | |
| 18 | x: 10, | |
| 19 | y: 5 | |
| 20 | }] | |
| 21 | }] | |
| 22 | }, | |
| 23 | options: { | |
| 24 | scales: { | |
| 25 | xAxes: [{ | |
| 26 | type: 'linear', | |
| 27 | position: 'bottom' | |
| 28 | }] | |
| 29 | } | |
| 30 | } | |
| 31 | }); | |
| 32 | ``` | |
| 33 | ||
| 34 | ## Dataset Properties | |
| 35 | The scatter chart supports all of the same properties as the [line chart](./line.md#dataset-properties). | |
| 36 | ||
| 37 | ## Data Structure | |
| 38 | ||
| 39 | Unlike the line chart where data can be supplied in two different formats, the scatter chart only accepts data in a point format. | |
| 40 | ||
| 41 | ```javascript | |
| 42 | data: [{ | |
| 43 | x: 10, | |
| 44 | y: 20 | |
| 45 | }, { | |
| 46 | x: 15, | |
| 47 | y: 10 | |
| 48 | }] | |
| 49 | ``` | |