Question

我正在尝试将KendoUI scatter chart example中找到的本地数据源示例转换为远程数据源。

如果我将数据转换为JSON文件，然后使用指向此JSON文件的传输选项配置数据源，我可以看到它是通过网络检索的。但图表上没有显示任何内容。

我错过了什么？这是一个parameterMap问题吗？架构问题？有系列配置的东西吗？

我在黑暗中，所以非常感谢任何帮助。：）

编辑：我不确定如何将JSON资源发布到jsfiddle，所以我只是在这里显示代码位。

    <div kendo-chart k-options="scatter"  k-theme="'silver'" k-data-source="fakeData">
    </div>

上面显示了HTML部分。

 $scope.scatter ={
        title: {
            position: "top",
            text: "Rainfall - Wind Speed"
        },
        legend: {
            position: "bottom"
        },
        seriesDefaults: {
        type: "scatter"
        },
        xAxis: {
            max: 35,
            title: {
                text: "Wind Speed [km/h]"
            },
            crosshair: {
                visible: true,
                tooltip: {
                    visible: true,
                    format: "n1"
                }
            }
        },


        yAxis: {
            min: -5,
            max: 25,
            title: {
                text: "Rainfall [mm]"
            },
            axisCrossingValue: -5,
            crosshair: {
                visible: true,
                tooltip: {
                    visible: true,
                    format: "n1"
                }
            }
        }
    };

    $scope.fakeData = new kendo.data.DataSource({

        transport: {
            read:  "data/scatter-chart.json",
            type: "json"
        }
    });

以上是控制器代码。

[{ ＆＃34; name＆＃34;：＆＃34; 2008年1月＆＃34;，＆＃34;数据＆＃34;：[ [16.4,5.4]，[21.7,2]，[25.4,3]，[19,2]，[10.9,1]，[13.6,3.2]，[10.9,7.4]，[10.9,0]，[10.9] ，8.2]，[16.4,0]，[16.4,1.8]，[13.6,0.3]，[13.6,0]，[29.9,0]，[27.1,2.3]，[16.4,0]，[13.6,3.7] ]，[10.9,5.2]，[16.4,6.5]，[10.9,0]，[24.5,7.1]，[10.9,0]，[8.1,4.7]，[19,0]，[21.7,1.8]， [27.1,0]，[24.5,0]，[27.1,0]，[29.9,1.5]，[27.1,0.8]，[22.1,2]] }，{ ＆＃34; name＆＃34;：＆＃34; 2009年1月＆＃34;，＆＃34;数据＆＃34;：[ [6.4,13.4]，[1.7,11]，[5.4,8]，[9,17]，[1.9,4]，[3.6,12.2]，[1.9,14.4]，[1.9,9]，[1.9 ，13.2]，[1.4,7]，[6.4,8.8]，[3.6,4.3]，[1.6,10]，[9.9,2]，[7.1,15]，[1.4,0]，[3.6,13.7 ]，[1.9,15.2]，[6.4,16.5]，[0.9,10]，[4.5,17.1]，[10.9,10]，[0.1,14.7]，[9,10]，[2.7,1.18]， [2.1,10]，[2.5,10]，[27.1,10]，[2.9,11.5]，[7.1,10.8]，[2.1,12]] }，{ ＆＃34; name＆＃34;：＆＃34; 2010年1月＆＃34;，＆＃34;数据＆＃34;：[ [21.7,3]，[13.6,3.5]，[13.6,3]，[29.9,3]，[21.7,20]，[19,2]，[10.9,3]，[28,4]，[27.1 ，0.3]，[16.4,4]，[13.6,0]，[19,5]，[16.4,3]，[24.5,3]，[32.6,3]，[27.1,4]，[13.6,6 ]，[13.6,8]，[13.6,5]，[10.9,4]，[16.4,0]，[32.6,10.3]，[21.7,20.8]，[24.5,0.8]，[16.4,0]， [21.7,6.9]，[13.6,7.7]，[16.4,0]，[8.1,0]，[16.4,0]，[16.4,0]] }]

上面是scatter-chart.json中引用的JSON

注意：我已经成功完成了其他更简单的Kendo图表实现。因此，假设所有Javascript和其他要求都是正确的。我在控制台上没有收到任何错误，可以检查检索到的数据对象。它根本无法渲染。我相当肯定有一些特殊的处理嵌套＆＃34;数据＆＃34;我没有正确初始化的数组。

Answer 1

与数据源一起使用时，图表小部件似乎会读取单个系列的数据。所以JSON文件应该是：

[ [16.4, 5.4], [21.7, 2], [25.4, 3], [19, 2] ... ]

为了从远程服务获取多个系列，您必须先读取它们，然后创建小部件，并将“series”配置选项设置为返回的数据。也可以在使用setOptions({series: data})创建窗口小部件后完成。

如何将本地kendoUI散点图示例转换为远程数据源？

1 个答案: