【问题标题】:amchart - Multiple Y-axis using the same X-axisamchart - 使用同一 X 轴的多个 Y 轴
【发布时间】:2014-03-26 09:41:29
【问题描述】:

我很困惑……

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

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

我已经复制了这个脚本,但我似乎可以理解它。唯一不同的是chartData:

  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 轴中获得“未定义”。 这是我将 xAxis 赋予图表的地方:

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

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

【问题讨论】:

    标签: java javascript scala playframework amcharts


    【解决方案1】:

    好吧,伙计们!

    答案是简单地将“值”与“类别”一起推送到 chartData。 请参见下面的示例:

    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;  
                }
    

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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多