使用两个Google图表时,一个垂直轴消失了

时间:2019-07-08 11:48:01

标签: javascript html

使用两个Google图表时,一个垂直轴消失。 第一个谷歌图表的垂直轴工作正常。 但是第二个Google图表的垂直轴不可见。 显然,我复制并粘贴了两个图表, 我有两个div,怎么了?

//这是我的代码

<script type="text/javascript" th:inline="javascript"> 
    /*<![CDATA[*/ 
    var year1 = /*[[ ${reallist3} ]]*/; //년별 매매
    var year2 = /*[[ ${reallist4} ]]*/; //년별 전월세
    /*]]>*/ 
    google.charts.load("current", {packages:['corechart']});
    google.charts.setOnLoadCallback(drawChart);
    function drawChart(){
        var data1 = new google.visualization.DataTable();
        data1.addColumn('string', 'Element');
        data1.addColumn('number', '가격');
        var data2 = new google.visualization.DataTable();
        data2.addColumn('string', 'Element');
        data2.addColumn('number', '가격');

        for(var i = 0; i < year1.length; i++){
                data1.addRow([year1[i].date + "(만원)", Number(year1[i].price)]);
        }
        for(var i = 0; i < year2.length; i++){
                data2.addRow([year2[i].date + "(만원)", Number(year2[i].price)]);
        }
         var view1 = new google.visualization.DataView(data1);
         view1.setColumns([0, 1,
            { calc: "stringify",
              sourceColumn: 1,
              type: "string",
              role: "annotation" }
         ]);

         var options1 = {
           width: 1100,
           height: 500,
           bar: {groupWidth: "50%"},
           legend: { position: "none" },
           vAxis: {minValue : 0},
           colors: ["pink","#81BEF7"],
           chartArea:{left:60,top:20,width:"80%",height:"85%"}
         };
         var chart1 = new google.visualization.ColumnChart(document.getElementById("chart_real1"));
         chart1.draw(view1, options1);  

         var view2 = new google.visualization.DataView(data2);
         view2.setColumns([0, 1,
            { calc: "stringify",
              sourceColumn: 1,
              type: "string",
              role: "annotation" }
         ]);

         var options2 = {
            width: 1100,
            height: 500,
            bar: {groupWidth: "50%"},
            legend: { position: "none" },
            vAxis: {minValue : 0},
            colors: ["pink","#81BEF7"],
            chartArea:{left:60,top:20,width:"80%",height:"85%"}
          };
          var chart2 = new google.visualization.ColumnChart(document.getElementById("chart_real2"));
          chart2.draw(view2, options2); 
    }
</script>

0 个答案:

没有答案