Basically, i have a quickchart image :
utilising the following code :
"https://quickchart.io/chart?c="&EncodeUrl("{
'type': 'scatter',
'data': {
'datasets': [
{
'label': 'MenacesData',
'showLine': true,
'lineTension': 0,
'borderWidth': 2,
'borderColor': 'rgba(0, 0, 255, 0)',
'data': [
{
'x': '2',
'y': '2'
},
],
'fill': false,
'spanGaps': false,
'pointRadius': 5,
'pointHoverRadius': 5,
'pointStyle': 'circle',
'borderDash': [
0,
0
],
'barPercentage': 0.9,
'categoryPercentage': 0.8,
'type': 'scatter',
'backgroundColor': 'blue',
'hidden': false
}
],
'labels': []
},
'options': {
'title': {
'display': true,
'position': 'top',
'fontSize': 12,
'fontFamily': 'sans-serif',
'fontColor': '#666666',
'fontStyle': 'bold',
'padding': 10,
'lineHeight': 1.2,
'text': 'Les Menaces'
},
'layout': {
'padding': {
'left': 0,
'right': 0,
'top': 0,
'bottom': 0
}
},
'legend': {
'display': false,
'position': 'top',
'align': 'center',
'fullWidth': true,
'reverse': false,
'labels': {
'fontSize': 12,
'fontFamily': 'sans-serif',
'fontColor': '#666666',
'fontStyle': 'normal',
'padding': 10
}
},
'scales': {
'xAxes': [
{
'id': 'X1',
'display': true,
'position': 'bottom',
'type': 'linear',
'stacked': false,
'time': {
'unit': false,
'stepSize': 1,
'displayFormats': {
'millisecond': 'h:mm:ss.SSS a',
'second': 'h:mm:ss a',
'minute': 'h:mm a',
'hour': 'hA',
'day': 'MMM D',
'week': 'll',
'month': 'MMM YYYY',
'quarter': '[Q]Q - YYYY',
'year': 'YYYY'
}
},
'distribution': 'linear',
'gridLines': {
'display': true,
'color': 'rgba(0, 0, 0, 0.1)',
'borderDash': [
0,
0
],
'lineWidth': 1,
'drawBorder': true,
'drawOnChartArea': true,
'drawTicks': true,
'tickMarkLength': 1,
'zeroLineWidth': 1,
'zeroLineColor': 'rgba(0, 0, 0, 0.25)',
'zeroLineBorderDash': [
0,
0
]
},
'angleLines': {
'display': true,
'color': 'rgba(0, 0, 0, 0.1)',
'borderDash': [
0,
0
],
'lineWidth': 1
},
'pointLabels': {
'display': true,
'fontColor': '#666',
'fontSize': 10,
'fontStyle': 'normal'
},
'ticks': {
'display': true,
'fontSize': 12,
'fontFamily': 'sans-serif',
'fontColor': '#666666',
'fontStyle': 'normal',
'padding': 0,
'min': 1,
'max': 4,
'stepSize': 0.25,
'minRotation': 0,
'maxRotation': 50,
'mirror': false,
'reverse': false
},
'scaleLabel': {
'display': true,
'labelString': 'Probabilite',
'lineHeight': 1.2,
'fontColor': '#666666',
'fontFamily': 'sans-serif',
'fontSize': 12,
'fontStyle': 'normal',
'padding': 4
}
}
],
'yAxes': [
{
'id': 'Y1',
'display': true,
'position': 'left',
'type': 'linear',
'stacked': false,
'time': {
'unit': false,
'stepSize': 1,
'displayFormats': {
'millisecond': 'h:mm:ss.SSS a',
'second': 'h:mm:ss a',
'minute': 'h:mm a',
'hour': 'hA',
'day': 'MMM D',
'week': 'll',
'month': 'MMM YYYY',
'quarter': '[Q]Q - YYYY',
'year': 'YYYY'
}
},
'distribution': 'linear',
'gridLines': {
'display': true,
'color': 'rgba(0, 0, 0, 0.1)',
'borderDash': [
0,
0
],
'lineWidth': 1,
'drawBorder': true,
'drawOnChartArea': true,
'drawTicks': true,
'tickMarkLength': 10,
'zeroLineWidth': 1,
'zeroLineColor': 'rgba(0, 0, 0, 0.25)',
'zeroLineBorderDash': [
0,
0
]
},
'angleLines': {
'display': true,
'color': 'rgba(0, 0, 0, 0.1)',
'borderDash': [
0,
0
],
'lineWidth': 1
},
'pointLabels': {
'display': true,
'fontColor': '#666',
'fontSize': 10,
'fontStyle': 'normal'
},
'ticks': {
'display': true,
'fontSize': 12,
'fontFamily': 'sans-serif',
'fontColor': '#666666',
'fontStyle': 'normal',
'padding': 0,
'min': 1,
'max': 4,
'stepSize': 0.25,
'minRotation': 0,
'maxRotation': 50,
'mirror': false,
'reverse': false
},
'scaleLabel': {
'display': true,
'labelString': 'Impact',
'lineHeight': 1.2,
'fontColor': '#666666',
'fontFamily': 'sans-serif',
'fontSize': 12,
'fontStyle': 'normal',
'padding': 4
}
}
]
},
'plugins': {
'datalabels': {
'display': false,
'align': 'center',
'anchor': 'center',
'backgroundColor': '#eee',
'borderColor': '#ddd',
'borderRadius': 6,
'borderWidth': 1,
'padding': 4,
'color': '#666666',
'font': {
'family': 'sans-serif',
'size': 10,
'style': 'normal'
}
},
'tickFormat': ''
},
'cutoutPercentage': 50,
'rotation': -1.5707963267948966,
'circumference': 6.283185307179586,
'startAngle': -1.5707963267948966
}
}")
and in my sharepoint list, i have a bunch of records that have the following columns:
- Impact (number 1-4)
- Probabilite (number 1-4)
basically, what i want to do is utilise this code to represent all the items in the list with "Impact" being the Y coordinate, and "Probabilite" being the X coordinate.
Quickcharts uses this code snippet to place the points :
'data': [
{
'x': '2',
'y': '2'
},
],
what i want to do, is repeat the {x, y} part as many times as i have records, and everytime give it it's according impact & probabilite.
EX:
Record 1 has impact 2 and probabilite 3.
- Create a new data point in {'x': '3', 'y': '2'}
How do i go around doing something like this?
If you have any questions i can clarify everything
