Question

我有一个使用图表的离子项目，我使用了 chart.js 库。如果我向图表提供虚拟数据，那么图表会显示颜色。这是它的代码。

home.ts

public donutChartData: String[] = ["1100","1200","1300"];
public donutChartLabels: String[] = ["I","Me","Myself"];
public donutChartType: string = "doughnut"

home.html的

<div style="display: block;">
<canvas baseChart [data]='donutChartData' height="350" [labels]='donutChartLabels' [chartType]='donutChartType'>
</canvas>

但是，如果我提供来自odoo服务器的自定义数据，则图表会显示为白色。这是我在控制台中从api获得的数据。

-------donutChartData------800,900,1000,1200,1500
-------donutChartLabels------01-Aug-2017,02-Aug-2017,03-Aug-2017,04-Aug-2017,05-Aug-2017

以下是自定义图表数据的代码。

home.ts

public donutChartData: String[] = [];
public donutChartLabels: String[] = [];
public donutChartType: string = "doughnut"

private display(): void {
    let model = "pedo.meter";
    let data = JSON.parse(localStorage.getItem("token"));
    let id: number = data.partner_id;

    this.odooRpc
    .searchRead(
        model,
        this.domain,
        this.fields,
        this.limit,
        this.offset,
        this.sort
    )
    .then((res: any) => {
        let json = JSON.parse(res._body)["result"].records;

        let clone = JSON.parse(JSON.stringify(this.pedoChartData));
        let clone2 = JSON.parse(JSON.stringify(this.doughnutChartColors));

        clone[0].data = [];
        clone2[0].backgroundColor = [];

        for (let i in json) {
        if (id === json[i].partner_id[0]) {
            let date = json[i].date;
            let latest_date: string = this.datePipe.transform(
            date,
            "dd-MMM-yyyy"
            );
            this.pedoChartLabels.push(latest_date);
            this.donutChartLabels.push(latest_date);

            clone[0].data.push(json[i].steps);
            clone2[0].backgroundColor.push(this.dynamicColors());
        }
        }
        this.donutChartData = clone[0].data;

        console.log("-------donutChartData------" + this.donutChartData);
        console.log("-------donutChartLabels------" + this.donutChartLabels);
        console.log("--------Json--------" + JSON.stringify(json));
    });
}

我google了很多，但无法理解为什么会发生这种情况。请帮帮我谢谢！

Answer 1

您好，请使用[colors] =＆＃34; chartColors＆＃34;画布

<强> home.html的

class test {  

    public static void main(String[] args) throws Exception{
    File f1 = new File("names.txt");
    Scanner scanner = new Scanner(f1);
    String nextLine= scanner.nextLine();
    String[] stuinfo= nextLine.split(":");
    scanner.close();


    String strname=stuinfo[0];
    String strage= stuinfo[1];
    String straddress= stuinfo[2];


    StudenInfo students=new StudenInfo();
    students.setName(strname);
    int intage = Integer.parseInt(strage);
    students.setAge(intage);

    students.setAddress(straddress);
    System.out.println(students.toString());

}

home.ts中的

创建变量;

<div style="display: block;">
<canvas baseChart [data]='donutChartData' height="350" [labels]='donutChartLabels' [colors]="chartColors" [chartType]='donutChartType'>
</canvas>

颜色没有出现在离子3的图表上

1 个答案: