首页 新闻 会员 周边 捐助

echarts+ashx饼图不显示返回的json数据

0
悬赏园豆：20 [已解决问题] 解决于 2017-09-04 15:01 
html+js 代码

<div class="chart_container" id="sales" style="width: 340px; height: 200px;">
                                <script type="text/javascript">
                                    // 基于准备好的dom，初始化echarts图表
                                    var myChart = echarts.init(document.getElementById('sales'));
                                     var option = {                                                             
                                        calculable: true,
                                        series: [
                                            {
                                                name: '总记录',
                                                type: 'pie',
                                                radius: '55%',
                                                center: ['50%', '60%'],
                                                data: []
                                            }
                                        ]
                                    };

                                     $.ajax({
                                         type: "post",
                                         async: false, //同步执行
                                         url: "/ashx/Echarts.ashx",
                                         dataType: "json", //返回数据形式为json
                                         success: function (result) {
                                             if (result) {                                               
                                                 option.series[0].data = result;
                                                 myChart.hideLoading();
                                                 myChart.setOption(option);
                                             }
                                         },
                                         error: function (errorMsg) {
                                             alert("图表加载出错，请刷新页面重试!");
                                         }
                                     });
                                </script>

                            </div>

ashx返回的数据

"[{value:2,name:'已考核'},{value:281,name:'未考核'}]"

echarts图表只显示一个圆，没有任何效果，希望各位帮忙看一下，不胜感激！
凯尔网络的主页 凯尔网络 | 初学一级 | 园豆：159
提问于：2016-11-29 15:57
< >
分享
最佳答案
0

参数不对 。

这个是我之前从官网找的demo

 // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(objData.main[0]);
        app.title = '堆叠柱状图';

        var option = {
            tooltip: {
                trigger: 'axis', //坐标轴触发，主要在柱状图，折线图等会使用类目轴的图表中使用。
                axisPointer: {// 坐标轴指示器，坐标轴触发有效
                    type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            xAxis: [//直角坐标系 grid 中的 x 轴
                {
                    type: 'category',
                    data: ['2015-10-01', '2015-10-02', '2015-10-03', '2015-10-04', '2015-10-05', '2015-10-06', '2016-08-23']
                }
            ],
            yAxis: [{ type: 'value' }], //直角坐标系 grid 中的 y 轴，
            series: [
                {
                    name: '张三',
                    type: 'bar',
                    data: [0, 0, 0, 0, 0, 0, 1]
                },
                {
                    name: '李四',
                    type: 'bar',
                    data: [120, 132, 101, 134, 90, 230, 12]
                },
                {
                    name: '王五',
                    type: 'bar',
                    data: [220, 182, 191, 234, 290, 330, 310]
                }
            ]
        };
        //使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);

我这个是柱子的形状 

echarts的官网api很详细的 你后台返回的json符合他的格式就ok

地址http://echarts.baidu.com/examples.html：选择符合自己的demo点击进去 有源代码。

api地址 ：

http://echarts.baidu.com/api.html#echarts

收获园豆：20
s_p | 初学一级 |园豆：140 | 2016-11-30 10:03
其他回答(2)
0

legend好像没看到，数据确定能放到data里吗？最好把整个series都放到ajax里面去生成。

建议：先在官网找个demo，再按照自己的需求改，慢慢来，细心的，总会成功的。

让我发会呆 | 园豆：2929 (老鸟四级) | 2016-11-29 16:13
0

很明显参数不够啊，去看看官方例子吧

balahoho | 园豆：2050 (老鸟四级) | 2016-11-29 17:25
清除回答草稿
   您需要登录以后才能回答，未注册用户请先注册。