I attempt to generate Donut chart code utilizing Json array. I’ve caught with in a single place
That is my code
<?php
$canvas_data = array(
'sort' => 'doughnut',
'information' => array(
'labels' => array(), // this array might be populated from the repeater
'datasets' => array(
'label' => '',
'backgroundColor' => array('#4e73df', '#1cc88a','#36b9cc','#df4e75'),
'borderColor'=> array('#ffffff','#ffffff','#ffffff','#ffffff'),
'information' => array() // this array might be populated from the repeater
)
),
'choices' => array(
'maintainAspectRatio' => false,
'legend' => array(
'show' => false,
),
'title' => array()
),
);
// loop over repeater and populate object
if (have_rows('donut_graph_details')) {
whereas (have_rows('donut_graph_details')) {
the_row();
$canvas_data['data']['labels'][] = get_sub_field('title');
$canvas_data['data']['datasets']['data'][] = get_sub_field('proportion');
}
}
// use json encode to output attribute
?>
<canvas data-bs-chart='<?php echo json_encode($canvas_data); ?>'></canvas>
Out put utilizing this code
<canvas data-bs-chart='{"type":"doughnut","data":{"labels":["IMPLEMENTED","PARTIALLY IMPLEMENTED","NOT IMPLEMENTED","UNDISCLOSED"],"datasets":{"label":"","backgroundColor":["#4e73df","#1cc88a","#36b9cc","#df4e75"],"borderColor":["#ffffff","#ffffff","#ffffff","#ffffff"],"data":["40","30","10","20"]}},"options":{"maintainAspectRatio":false,"legend":{"display":false},"title":[]}}'></canvas>
However i wish to do small modification to the Out put. I wish to add "[" before starting "datasets" and wants to close.
I have add the modification code below.
<canvas data-bs-chart='{"type":"doughnut","data":{"labels":["IMPLEMENTED","PARTIALLY IMPLEMENTED","NOT IMPLEMENTED","UNDISCLOSED"],"datasets":[{"label":"","backgroundColor":["#4e73df","#1cc88a","#36b9cc","#df4e75"],"borderColor":["#ffffff","#ffffff","#ffffff","#ffffff"],"data":["40","30","10","20"]}]},"options":{"maintainAspectRatio":false,"legend":{"display":false},"title":[]}}'></canvas>
Additionally final "title" has sq. bracket. I wish to exchange these with "{}"