如何在d3pie图表中更新数据?

时间:2015-12-16 10:31:31

标签: javascript d3.js d3pie.js

我必须在应用程序中生成饼图。所以我尝试了这个。

var il = document.getElementById("il").value;

var ir = document.getElementById('ir').value;
var iw = document.getElementById('iw').value; <script>
var pie = new d3pie("pieChart",{
        alert('hello');
    "header": {
        "title": {
            "fontSize": 22,
            "font": "verdana"
        },
        "subtitle": {
            "color": "#999999",
            "fontSize": 10,
            "font": "verdana"
        },
        "titleSubtitlePadding": 12
    },
    "footer": {
        "color": "#999999",
        "fontSize": 11,
        "font": "open sans",
        "location": "bottom-center"
    },
    "size": {
        "canvasHeight": 206,
        "canvasWidth": 450,
        "pieInnerRadius": "60%",
        "pieOuterRadius": "70%"
    },
    "data": {
        "content": [
            {
                "label": "Incidents Logs",
                "value": this.il,
                "color": "#38A4DD"
            },
            {
                "label": "Incidents resolved",
                "value":this.ir,
                "color": "#FFC400"
            },
            {
                "label": "incidentsWip",
                "value": this.iw,
                "color": "#B39DDB"
            }
        ]
    },
    "labels": {
        "outer": {
            "format": "none",
            "pieDistance": 32
        },
        "inner": {
            "format": "value"
        },
        "mainLabel": {
            "font": "verdana"
        },
        "percentage": {
            "color": "#e1e1e1",
            "font": "verdana",
            "decimalPlaces": 0
        },
        "value": {
            "color": "#e1e1e1",
            "font": "verdana"
        },
        "lines": {
            "enabled": true,
            "color": "#cccccc"
        },
        "truncation": {
            "enabled": true
        }
    },
    "tooltips": {
        "enabled": true,
        "type": "placeholder",
        "string": "{label}: {value}, {percentage}%",
        "styles": {
            "fontSize": 20
        }
    },  
    "effects": {
        "pullOutSegmentOnClick": {
            "effect": "linear",
            "speed": 400,
            "size": 8
        }
    }
});

</script>

但是,我需要在图表中动态更新数据。所以我尝试在html中隐藏输入字段,如此

<input id="il" type="hidden" value="<?php echo $data['incidentslogs'];  ?>" /> <input id="ir" type="hidden" value="<?php echo $data['incidentsresolved']; ?>" />          <input id="iw" type="hidden" value="<?php echo $data['incidentswip']; ?>"  />

我尝试使用document.GetElementById()。value调用这些隐藏值,但不知道如何在d3pie()中插入这些值。请帮忙。

0 个答案:

没有答案