使用ajax将数据加载到html5画布轮盘中答案

【问题标题】：Loading data into html5 canvas roullete using ajax使用ajax将数据加载到html5画布轮盘中
【发布时间】：2012-01-06 10:57:44
【问题描述】：

我正在尝试将数据加载到我在这里找到的 html5 画布轮盘中： http://www.switchonthecode.com/tutorials/creating-a-roulette-wheel-using-html5-canvas

我添加了另一个名为 loader 的按钮，它将从 php 文件中加载数据。数据是一个名称数组。然后我将它分配给 people 数组。然后调用drawRouletteWheel()。 drawRouletteWheel 使用 people 数组中的数据。

var people = [];
    $('#loader').click(function(){
        $.post('loader.php', function(data){
            people = data;
            drawRouletteWheel();

        });
    });

loader.php 文件只是加载从 mysql 数据库中获取的随机记录：

$select_random = $db->get_results("SELECT people FROM tbl_people ORDER BY RAND() LIMIT 12");
    if(!empty($select_random)){
        foreach($select_random as $k=>$v){
            $data[] = $v->people;
        }
        echo json_encode($data);
    }

实际上正在将某些内容加载到轮盘赌中，但似乎不完整。萤火虫也返回了一些东西：

我需要在这里做什么？似乎从 php 文件返回的数据没有被视为数组。

【问题讨论】：

谢谢！有用。我从没想过我还需要解析它。
很抱歉，当我输入正确答案时，评论只是权宜之计

标签： php jquery json

【解决方案1】：

从 php 页面返回的数据被视为字符串，因此当 javascript 获取每个索引处的字符时，您将获得单个字母。

解决这个问题：

var people = [];
    $('#loader').click(function(){
        $.post('loader.php', function(data){
            people = $.parseJSON(data);
            drawRouletteWheel();
    });
});

【讨论】：