如何自定义左右两侧数据

[wangtingshun]

你好，如下图

2.如何去掉X轴基线

[AAChartModel]

参考:

• AAChartModel/AAChartKit#901
• AAChartModel/AAChartKit#952
• AAChartModel/AAChartKit#1324
• AAChartModel/AAChartKit#1330

[AAChartModel]

其中主要的参考示例:

• AAChartModel/AAChartKit#1330

此示例的 Java 版本的配置方式如下:

    //https://github.com/AAChartModel/AAChartKit/issues/1324
    //https://github.com/AAChartModel/AAChartKit/issues/1330
    public static AAOptions configureTheAxesLabelsFormattersOfDoubleYAxesChart3() {
        AAChart aaChart = new AAChart()
                .backgroundColor(AAColor.White);

        AATitle aaTitle = new AATitle()
                .text("");

        AAXAxis aaXAxis = new AAXAxis()
                .visible(true)
                .min(0)
                .categories(new String[]{
                        "Java", "Swift", "Python", "Ruby", "PHP", "Go","C",
                        "C#", "C++", "Perl", "R", "MATLAB", "SQL"
                });

        AAPlotOptions aaPlotOptions = new AAPlotOptions()
                .series(new AASeries()
                        .marker(new AAMarker()
                                .radius(7)//曲线连接点半径，默认是4
                                .symbol(AAChartSymbolType.Circle)//曲线点类型："circle", "square", "diamond", "triangle","triangle-down"，默认是"circle"
                                .fillColor(AAColor.White)//点的填充色(用来设置折线连接点的填充色)
                                .lineWidth(3)//外沿线的宽度(用来设置折线连接点的轮廓描边的宽度)
                                .lineColor("")//外沿线的颜色(用来设置折线连接点的轮廓描边颜色，当值为空字符串时，默认取数据点或数据列的颜色)
                        ));

        AAYAxis yAxis1 = new AAYAxis()
                .visible(true)
                .lineWidth(1)
                .tickPositions(new Object[]{0, 50, 100, 150, 200})
                .labels(new AALabels()
                        .enabled(true)
                        .style(new AAStyle()
                                .color("DodgerBlue"))
                        .formatter("function () {\n" +
                                "       var yValue = this.value;\n" +
                                "       var unitStr = \"千\";\n" +
                                "       if (yValue == 0) {\n" +
                                "           unitStr = \"\";\n" +
                                "       }\n" +
                                "       var formattedYValue = (yValue / 1000).toFixed(3) + unitStr;\n" +
                                "       return formattedYValue;\n" +
                                "   }"))//Y轴文字数值为 0 的时候, 不显示单位
                .gridLineWidth(0)
                .title(new AATitle()
                        .text("以「千」为单位")
                        .style(AAStyle.style("DodgerBlue", 14, AAChartFontWeightType.Bold)));

        AAYAxis yAxis2 = new AAYAxis()
                .visible(true)
                .lineWidth(1)
                .tickPositions(new Object[]{0, 50, 100, 150, 200})
                .labels(new AALabels()
                        .enabled(true)
                        .style(new AAStyle()
                                .color(AAColor.Red))
                        .formatter("function () {\n" +
                                "       var yValue = this.value;\n" +
                                "       var unitStr = \"万\";\n" +
                                "       if (yValue == 0) {\n" +
                                "           unitStr = \"\";\n" +
                                "       }\n" +
                                "       var formattedYValue = (yValue / 10000).toFixed(4) + unitStr;\n" +
                                "       return formattedYValue;\n" +
                                "   }"))//Y轴文字数值为 0 的时候, 不显示单位
                .gridLineWidth(0)
                .title(new AATitle()
                        .text("以『万』为单位")
                        .style(AAStyle.style(AAColor.Red, 14, AAChartFontWeightType.Bold)))
                .opposite(true)
                ;

        AATooltip aaTooltip = new AATooltip()
                .enabled(true)
                .shared(true);

        AASeriesElement[] seriesArr = {
                new AASeriesElement()
                        .name("2020")
                        .type(AAChartType.Spline)
                        .lineWidth(7)
                        .color(AAGradientColor.DeepSea)
                        .borderRadius(4)
                        .yAxis(1)
                        .data(new Object[]{
                        0, 71.5, 106.4, 129.2, 144.0, 176.0,
                        135.6, 148.5, 216.4, 194.1, 95.6, 54.4
                }),
                new AASeriesElement()
                        .name("2021")
                        .type(AAChartType.Spline)
                        .lineWidth(7)
                        .color(AAGradientColor.Sanguine)
                        .yAxis(0)
                        .data(new Object[]{
                        135.6, 148.5, 216.4, 194.1, 95.6, 54.4,
                        0, 71.5, 106.4, 129.2, 144.0, 176.0
                })
        };

        AAOptions aaOptions = new AAOptions()
                .chart(aaChart)
                .title(aaTitle)
                .plotOptions(aaPlotOptions)
                .xAxis(aaXAxis)
                .yAxisArray(new AAYAxis[]{yAxis1, yAxis2})
                .tooltip(aaTooltip)
                .series(seriesArr);

        return aaOptions;
    }

demo 中有此示例, 下载运行查看即可.

[AAChartModel]

//https://github.com/AAChartModel/AAChartKit/issues/901
//https://github.com/AAChartModel/AAChartKit/issues/952
public static AAOptions configureTheAxesLabelsFormattersOfDoubleYAxesChart() {
    ...
    ...
}

//https://github.com/AAChartModel/AAChartKit/issues/1324
public static AAOptions configureTheAxesLabelsFormattersOfDoubleYAxesChart2() {
    ...
    ...
}

//https://github.com/AAChartModel/AAChartKit/issues/1324
//https://github.com/AAChartModel/AAChartKit/issues/1330
public static AAOptions configureTheAxesLabelsFormattersOfDoubleYAxesChart3() {
    ...
    ...
}

Java 版本的 demo 中, 这三个是相似关联的双 Y 轴示例, 可对比参考查看.

[AAChartModel]

2.如何去掉X轴基线

设置 Y 轴轴线的宽度为 0 即可.