【问题标题】:Sunburst chart in angular角度的旭日形图
【发布时间】:2019-09-05 11:05:34
【问题描述】:

您好,我正在使用 Highchart 制作旭日形图,但是出现错误,我无法在我的代码中找到错误,所以请帮助我。

我的 HTML 代码是:

<highcharts-chart
    [Highcharts]="highcharts1"
    [options]="chartOptions1"
    style="width: 100%; height: 200px; display: block;">
  </highcharts-chart>

Ts 码是

chartData = [
        {
            id: '2.13',
            parent: '1.3',
            name: 'Southern Asia'
        }
        ];
 highcharts1: typeof Highcharts = Highcharts;
    chartOptions1: Highcharts.Options = <any> {
        chart: {
            height: '100%'
        },
        title: {
            text: 'World population 2017'
        },
        subtitle: {
            text: 'Source <href="https://en.wikipedia.org/wiki/List_of_countries_by_population_(United_Nations)">Wikipedia</a>'
        },
        series: [{
            type: "sunburst",
            data: this.chartData,
            allowDrillToNode: true,
            cursor: 'pointer',
            dataLabels: {
                format: '{point.name}',
                filter: {
                    property: 'innerArcLength',
                    operator: '>',
                    value: 16
                }
            },
            levels: [{
                level: 1,
                levelIsConstant: false,
                dataLabels: {
                    filter: {
                        property: 'outerArcLength',
                        operator: '>',
                        value: 64
                    }
                }
            }, {
                level: 2,
                colorByPoint: true
            },
            {
                level: 3,
                colorVariation: {
                    key: 'brightness',
                    to: -0.5
                }
            }, {
                level: 4,
                colorVariation: {
                    key: 'brightness',
                    to: 0.5
                }
            }]

        }]
    };

" 得到以下错误。 错误错误:Highcharts 错误 #17:www.highcharts.com/errors/17 在 c.Chart.h (highcharts.js:12) " 任何人都可以帮助我在我的代码中缺少什么

【问题讨论】:

    标签: javascript angular highcharts


    【解决方案1】:

    需要导入并初始化sunburst模块:

    import * as Highcharts from 'highcharts';
    import HC_sunburst from 'highcharts/modules/sunburst';
    HC_sunburst(Highcharts);
    

    文档: https://github.com/highcharts/highcharts-angular#to-load-a-module

    【讨论】:

    • 您好,我正在尝试对 3 个级别的深色、浅色和非常浅色等级别进行颜色变化,我怎样才能做到这一点。
    • 嗨@Sudhir,请使用highcharts 标签创建一个新问题。
    【解决方案2】:

    旭日图需要以下模块modules/sunburst.js。

    Sunburst.js 位置: https://code.highcharts.com/modules/sunburst.js

    API 参考: https://www.highcharts.com/docs/chart-and-series-types/sunburst-series

    【讨论】:

    • 如何在angular7中导入
    • 您好,我正在尝试对 3 个级别的深色、浅色和非常浅色等级别进行颜色变化,我怎样才能做到这一点。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-07-22
    • 2016-05-09
    • 2022-01-04
    相关资源
    最近更新 更多