代码之家 › 专栏 › 技术社区 › Dave Kapildev

js devexpress PieChart系列颜色运行时

chartjs-2.6.0 pie-chart chart.js devexpress javascript

Dave Kapildev · 技术社区 · 7 年前

我正在努力 js.devexpress Pie Chart 。我想在运行时更改序列颜色。

我正在从webservice获取数据,根据我的逻辑,我必须根据值更改红色或绿色。如果值小于0[零],则饼图颜色为红色,否则为绿色。

我的代码是

 <div id="canvas-holder" >       
    <div id="pie" ></div>
</div>

 var pie =   $("#pie").dxPieChart({
        size: {width: 500},
        //palette: "bright",
        dataSource: [{country: "On",area: 0}],
        series: [{argumentField: "country", valueField: "area"}],
        title: "Area of Countries"             
    }).dxPieChart("instance");

    setInterval(function () {
        debugger;
        pie.option("Color", "red");

        pie.element().css({ Color: 'red' })

        var chartOptions = pie.option();
        pie.series[0].Color = "red";
        pie.option(chartOptions);

    }, 1000);
</script>

1 回复 | 直到 7 年前

Dave Kapildev 7 年前

我找到的快速解决方案:访问devexpress支持论坛 More Details

Sample Code Download link

代码为

<div id="canvas-holder">
    <div id="pie"></div>
</div>

<script>
    var ds = [{ country: "On", area: 0 }];

    var pie = $("#pie").dxPieChart({
        size: { width: 500 },
        //palette: "bright",
        dataSource: ds,
        series: [{ argumentField: "country", valueField: "area" }],
        title: "Area of Countries",
        customizePoint: function (pointInfo) {
            if (pointInfo.value <= 0) {
                return {
                    color: "red"
                }
            }
            return {
                color: "green"
            }
        }
    }).dxPieChart("instance");

    var isVal = 0;

    setInterval(function () {           

        if (isVal == 0)
            isVal = 1;
        else
            isVal = 0;

        ds[0].area = 1;

        pie.option("dataSource", ds);

    }, 1000);

</script>

推荐文章

Dave Kapildev · js devexpress PieChart系列颜色运行时

7 年前

millimoose Tomasz Nurkiewicz · DevExpress表达式语言中日期时间常数的格式是什么?

7 年前

SeeWICDo · 类似函数Lookupedit。WPF中的accepteditortextasnewvalue

7 年前

climivin · 如何在表单上放置图片?

7 年前

gruff · DevExpress级联组合框GridView数据绑定

7 年前

AlaaL · DevExtreme dxGrid lookup column form display id而不是DisplayExpr

7 年前

Fes Nguyen · Devexpress我可以用Devexpress 12到17更新project,但它在Windows XP上仍然运行良好吗?

7 年前

Benni To · 在执行视图模型中的方法之后,如何使视图中的方法执行?

7 年前

Liam neesan · 如何在winforms应用程序上使用C#代码将数据绑定到devexpress gridview?

7 年前

Jack Daniels · 从mdi父级访问子窗体组控件元素

7 年前