PHP使用JSON数组生成Donut环形图时datasets输出结构调整问题

你需要调整PHP数组的结构，让datasets字段成为包含数据集配置的索引数组即可，总共需要修改两处代码：

• 初始化$canvas_data时，把原来的datasets配置外层套一层索引数组
• 循环填充数据时，修改data字段的写入路径，增加[0]取索引数组的第一个元素

修改后的完整代码如下：

<?php 
  $canvas_data = array(
    
    'type' => 'doughnut',
    'data' => array(
      'labels' => array(),  // this array will be populated from the repeater
      'datasets' => array(
        // 新增一层数组包裹原有数据集配置
        array(
          'label' => '',
          'backgroundColor' => array('#4e73df', '#1cc88a','#36b9cc','#df4e75'),
          'borderColor'=> array('#ffffff','#ffffff','#ffffff','#ffffff'),
          'data' => array() // this array will be populated from the repeater
        )
      )
    ),
    'options' => array(
      'maintainAspectRatio' => false,
      'legend' => array(
        'display' => false,
      ),
      'title' => array()
    ),
  );
  // loop over repeater and populate object
  if (have_rows('donut_graph_details')) {
    while (have_rows('donut_graph_details')) {
      the_row();
      $canvas_data['data']['labels'][] = get_sub_field('title');
      // 路径新增[0]，匹配修改后的数组结构
      $canvas_data['data']['datasets'][0]['data'][] = get_sub_field('percentage');
    }
  }
  // use json encode to output attribute
?>
<canvas data-bs-chart='<?php echo json_encode($canvas_data); ?>'></canvas>

修改原理：PHP的索引数组经过json_encode处理后会转为JSON数组格式，关联数组会转为JSON对象格式。调整后datasets是包含1个关联数组元素的索引数组，编码后就会得到你需要的[{...}]结构。

内容的提问来源于stack exchange，提问作者Buddika