Skip to content
XING Yun edited this page Jul 30, 2017 · 31 revisions

General options for basic charts:

Stacked:

  • General
  • Stacked Bar
  • Stacked Area
  • Stream
  • Multi-Line
  • Corona

General options for basic charts

{
    color: DefaultSequentialColor,
    chart: {
        margin: {
            left: 60,
            bottom: 50,
            right: 10,
            top: 20
        }
    },
    ordering: {
        accessor: null,
        direction: 'asc'
    },

    xAxis: {
        allowDecimals: false,
        scale: null,
        ticks: 0,
        tickFormat: null,
        max: null,
        min: null,
        labelAngle: 0,

        title: {
            text: '',
            style: ''
        }
    },

    yAxis: [
        {
            allowDecimals: false,
            scale: null,
            max: null,
            min: null,
            ticks: 0,
            tier: 6,
            title: {
                text: '',
                style: ''
            }
        }
    ],

    data: {
        x: {
            accessor: null,
            type:  FieldType.NUMBER,
            formatter: null,
        },
        y: [
            {
                accessor: null,
                type:  FieldType.NUMBER,
                formatter:  null,
                yAxis: 0,
                tooltip: {
                    valueSuffix: null
                }
            }
        ]
    }

Bar

{
    chart: { type: 'bar_horizontal'}
}

Area

{
    chart: {
        type: 'area_horizontal'
    },
    plots: {
        areaOpacity: 1,
        curve: 'cardinal',
        strokeWidth: 4,
        nodeRadius: 4,
        drawArea: true,
        showDots: true
    },
}

Line

{
    chart: {
        type: 'line',
    },
    plots: {
        curve: 'linear',
        strokeWidth: 3,
        nodeRadius: 4,
        areaOpacity: 1,
        drawArea: false,
        showDots: true
    }
}

Scatter

{
    chart: {
        type: 'scatter',
    },
    plots: {
        blur: false,
        opacity: 1,
        bubble: {
            min: 6,
            max: 20,
            default: 8
        }
    },

    zAxis: {
        allowDecimals: false,
        scale: null,
        max: 100,
        min: 0,
    },

    data: {
        z: {
            accessor: null,
            type:  FieldType.NUMBER,
            formatter:  null,
        },
    }
}

Pie

{
    chart: {
        type: 'pie'
    },
    animation: {
        duration: {
            slice: 1000,
        }
    },
    plots: {
        othersTitle: 'Others',
        isDonut: false,
        innerRadiusRatio: 0.4
    },
    slice: {
        labelPosition: 'auto',
        labelMinPercentage: 0.01
    }
}

General options for stacked charts

{
    chart: {
        margin: {
            left: 60,
            bottom: 50,
            right: 10,
            top: 20
        }
    },
    color: DefaultCategoricalColor,
    ordering: {
        accessor: null,
        direction: 'asc'
    },

    series: {
        allowDecimals: false,
        scale: null,
        max: null,
        min: null,
        ticks: 0,
        title: {
            text: '',
            style: ''
        }
    },


    xAxis: {
        allowDecimals: false,
        scale: null,
        ticks: 0,
        tickFormat: null,
        max: null,
        min: null,
        labelAngle: 0,

        title: {
            text: '',
            style: ''
        }
    },

    yAxis: [
        {
            allowDecimals: false,
            scale: null,
            max: null,
            min: null,
            ticks: 0,
            title: {
                text: '',
                style: ''
            }
        }
    ],

    data: {
        s: {
            accessor: null,
            type:  FieldType.STRING,
            formatter: function () { }
        },
        x: {
            accessor: null,
            type:  FieldType.NUMBER,
            formatter: ()=> { }
        },
        y: [
            {
                accessor: null,
                type:  FieldType.NUMBER,
                formatter: function () { },
                yAxis: 0
            }
        ],
    }
Clone this wiki locally