java - amchart - 使用相同 X 轴的多个 Y 轴

标签 java javascript scala playframework amcharts

我很困惑......

我正在尝试创建具有多个 Y 轴的串行 amchart,但我希望它们使用相同的 X 轴。 Amcharts.com 有一个演示 ( http://www.amcharts.com/demos/multiple-value-axes/ )

我已将输出放在 JSfiddle 上供您查看:http://jsfiddle.net/2cMMF/3/ 正如您所看到的,年份在 X 轴上显示了两次,

这个脚本是我复制的,但我似乎可以做对。唯一不同的是图表数据:

  function generateChartData() {
            var chartData = [];
            var xAxis;
            var yAxis;

            @for(j <- 0 until totalAmountForms){
                @for(i <- 0 until data.get(j).length) {
                yAxis = @data.get(j).get(i)
                xAxis = @label.get(j).get(i)
                @if(j==0){
                    chartData.push({
                        values1: yAxis,
                        categories: xAxis
                });
                }
                @if(j==1){
                    chartData.push({
                        values2: yAxis,
                        categories: xAxis
                });
                }
                @if(j==2){
                    chartData.push({
                        values3: yAxis,
                        categories: xAxis
                });
                }
                @if(j==3){
                    chartData.push({
                        values4: yAxis,
                        categories: xAxis
                });
                }
                @if(j==4){
                    chartData.push({
                        values5: yAxis,
                        categories: xAxis
                });
                }
            }
            }
            return chartData;  
            }

知道我在这里可能做错了什么吗? 我还尝试生成一次 xAxis,但只是在图形 X 轴中得到“未定义”。 这是我为图表指定 x 轴的位置:

"categoryField":"categories",
                "categoryAxis": {
                "parseDate": false,
                "axisColor": "#DADADA",
                "minorGridEnabled": true
            }

我将 Play Framework 与 Scala 一起使用(代码是有效的,并且可以编译,但没有正确显示图表)。

最佳答案

好的,伙计们!

答案是简单地将“值”与“类别”一起推送到图表数据。 请参阅下面的示例:

function generateChartData() {
            var chartData = [];
            var xAxis;
            var yAxis1;
            var yAxis2;
            var yAxis3;
            var yAxis4;
            var yAxis5;

                @if(totalAmountForms==1){
                    @for(i <- 0 until data.get(0).length) {
                        xAxis = @label.get(0).get(i)
                        yAxis1 = @data.get(0).get(i)

                    chartData.push({
                        values1: yAxis1,
                        categories: xAxis
                });
                    }
                }
                @if(totalAmountForms==2){
                    @for(i <- 0 until data.get(1).length) {
                        xAxis = @label.get(0).get(i)
                        yAxis1 = @data.get(0).get(i)
                        yAxis2 = @data.get(1).get(i)

                    chartData.push({
                        values1: yAxis1,
                        values2: yAxis2,
                        categories: xAxis
                });
                    }
                }
                @if(totalAmountForms==3){
                    @for(i <- 0 until data.get(2).length) {
                        xAxis = @label.get(0).get(i)
                        yAxis1 = @data.get(0).get(i)
                        yAxis2 = @data.get(1).get(i)
                        yAxis3 = @data.get(2).get(i)

                    chartData.push({
                        values1: yAxis1,
                        values2: yAxis2,
                        values3: yAxis3,
                        categories: xAxis
                });
                    }
                }
                @if(totalAmountForms==4){
                    @for(i <- 0 until data.get(3).length) {
                        xAxis = @label.get(0).get(i)
                        yAxis1 = @data.get(0).get(i)
                        yAxis2 = @data.get(1).get(i)
                        yAxis3 = @data.get(2).get(i)
                        yAxis4 = @data.get(3).get(i)

                    chartData.push({
                        values1: yAxis1,
                        values2: yAxis2,
                        values3: yAxis3,
                        values4: yAxis4,
                        categories: xAxis
                });
                    }
                }
                @if(totalAmountForms==5){
                    @for(i <- 0 until data.get(4).length) {
                        xAxis = @label.get(0).get(i)
                        yAxis1 = @data.get(0).get(i)
                        yAxis2 = @data.get(1).get(i)
                        yAxis3 = @data.get(2).get(i)
                        yAxis4 = @data.get(3).get(i)
                        yAxis5 = @data.get(4).get(i)

                    chartData.push({
                        values1: yAxis1,
                        values2: yAxis2,
                        values3: yAxis3,
                        values4: yAxis4,
                        values5: yAxis5,
                        categories: xAxis
                });
                    }
                }
            return chartData;  
            }

不是我写过的最好的代码,但它现在可以工作......

关于java - amchart - 使用相同 X 轴的多个 Y 轴,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22656909/

相关文章:

string - 字符串插值与串联

java - 哪个加载器负责在 JVM 中加载自己的类

java - Spring 启动验证不起作用

java - 尝试扩展 HttpURLConnection 类时出错

javascript - RegExp 只允许单词之间有一个空格

javascript - 在不知道javascript中JSON格式的情况下用Java解析JSON

javascript - React - 将 Prop 与单独的文件一起使用以避免硬编码?

scala - Apache Spark 中的递归方法调用

java - 如何使用 mockito 测试运行异步线程的方法

scala - toList 和 toBuffer 之间的类型推断不一致