在图表中显示 AJAX 数据答案

【问题标题】：Displaying AJAX data in a graph在图表中显示 AJAX 数据
【发布时间】：2014-12-08 18:24:31
【问题描述】：

我想在图表中显示来自网络服务的数据。我想在 x 轴上有小时（1-24），在 y 轴上只有 0&1 值。现在，如果我说 9.15-9.30，则值为 1；如何在图表中显示它？

我想使用 Fusion Charts 或 Google Charts。

【问题讨论】：

贴出你到现在为止尝试过的代码。
我正在尝试使用融合图表中的赢/输图。我不明白如何将数据传递给该图表。
贴出你的代码，我可以帮你。
要使用赢/输图表，请将数据作为 W/L/D 传递。例如，胜利可以描述为 1。设定值可以是 3 种类型： W - 表示胜利 L - 表示失败 D - 表示平局。请参阅更详细的格式：docs.fusioncharts.com/tutorial-attr-sparkwl.html

标签： ajax google-visualization fusioncharts

【解决方案1】：

要将数据传递到 FusionCharts 中的胜负图表，您可以使用this fiddle。在这个小提琴中，W 代表胜利（在您的情况下为 1），L 代表失败（在您的情况下为 0） http://jsfiddle.net/fusioncharts/5sP8q/

如果这个答案有帮助，请告诉我。

FusionCharts.ready(function () {
    var salesTarget = new FusionCharts({
        type: 'sparkwinloss',
        renderAt: 'chart-container',
        width: '350',
        height: '50',
        dataFormat: 'json',
        dataSource: {
            "chart": {
                "caption": "On-target sales by month",
                "subcaption": "Last year",
                "numberPrefix": "$",
                "chartTopMargin": "10",
                "chartBottomMargin": "10",
                "chartRightMargin": "10",
                "showBorder": "0",
                "bgColor": "#ffffff",                                
                "winColor": "#1aaf5d",
                "lossColor": "#8e0000",
                "showHoverEffect": "1",
                "canvasBorderThickness": "0"
            },
            "dataset": [
                {
                    "data": [
                        {
                            "value": "W"
                        },
                        {
                            "value": "W"
                        },
                        {
                            "value": "W"
                        },
                        {
                            "value": "L"
                        },
                        {
                            "value": "W"
                        },
                        {
                            "value": "W"
                        },
                        {
                            "value": "L"
                        },
                        {
                            "value": "L"
                        },
                        {
                            "value": "W"
                        },
                        {
                            "value": "L"
                        },
                        {
                            "value": "W"
                        },
                        {
                            "value": "W"
                        }
                    ]
                }
            ]
        }
    })
    .render();
});

【讨论】：