首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >fusioncharts更新FusionCharts数据而不更改图表设置

fusioncharts更新FusionCharts数据而不更改图表设置
EN

Stack Overflow用户
提问于 2014-08-26 17:14:55
回答 1查看 5.4K关注 0票数 6

有没有办法只设置Fusionchart图形的“数据”属性。因为目前在后期设置数据时,需要传递同时具有" data“和"chart”属性的完整json对象。

下面是我的示例代码;

代码语言:javascript
复制
FusionCharts.ready(function () {
    var ageGroupChart = new FusionCharts({
        id: 'total-users',
        type: 'pie2d',
        renderAt: 'chart-container',
        width: '450',
        height: '300',
        dataFormat: 'json',
            "chart": {
                "caption": "Sample Graph",
                "enableSmartLabels": "0",
                "showPercentValues": "1",
                "showTooltip": "0",
                "decimals": "1",
                "theme": "ocean"
            },
            "data":null
        });
    ageGroupChart.setJSONUrl( "http://www.example.com/GetData.php" );
    ageGroupChart.render(); 
});

正如您所看到的,我正在设置来自在线来源的数据。如果在线来源不需要将“图表”属性与数据一起发送,我会更喜欢。这样我就可以把UI的外观和感觉从数据源中分离出来。

有什么想法吗?

EN

回答 1

Stack Overflow用户

发布于 2014-08-26 17:41:39

我通过XLMhttpRequest调用使用了以下函数:

代码语言:javascript
复制
function updateChart(data) {
    var jsonData = {
        "chart": {
            // Some rendering options
            "caption": caption,
            "subcaption": ""
        },
        "data": data
    };

    // First time I initialize my chart
    if (FusionCharts("myChartId") === undefined) {
        var chart = new myChartId({
            // Some rendering options
            swfUrl: "Charts/MSLine.swf",
            id: "myChartId",
            width: "100%",
            height: "280px",
            dataFormat: 'json'
        });
        chart.setJSONData(jsonData);
        chart.render("myContainerId");
    } else
        // Then I just update
        FusionCharts("myChartId").setJSONData(jsonData);
}

我在成功回调中调用了updateChart函数:

代码语言:javascript
复制
success: function(data, request) {
    try {
        var d = JSON.parse(data);

        updateChart(d.chart);

        // Other job...
        var event = new CustomEvent("dataReceivedFromAjax", {"detail": d});
        document.dispatchEvent(event);

    } catch (e) {
        window.console.warn("Wrong format JSON data received");
        window.console.warn(data);
    }
}

当然,您可以根据您的情况调整我的代码(例如,我使用JsonData而不是JsonUrl)。

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/25502132

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档