2014-11-02 70 views
0

我有两行的amchart:Amchart两条线

<script type="text/javascript"> 
var chart; 
var graph; 
var chartData2 = [ 
      {"year":"2014-10-04 23:30:03", "v1":9.1, "v2":0}, 
      {"year":"2014-10-04 23:45:02", "v1":8.8, "v2":86.2}, 
      ... 
      {"year":"2014-10-05 23:30:02", "v1":8.7, "v2":98.7}, 
      {"year":"2014-10-05 23:45:02", "v1":8.5, "v2":98.7}, 
      {"year":"2014-10-06 00:00:01", "v1":8.4, "v2":98.5}, 
      {"year":"2014-10-06 00:15:02", "v1":8.5, "v2":98.3}, 
      {"year":"2014-10-06 00:30:01", "v1":8.4, "v2":97.9} 
     ]; 

     AmCharts.ready(function() { 
      // SERIAL CHART 
      chart = new AmCharts.AmSerialChart(); 
      chart.pathToImages = "../amcharts/images/"; 
      chart.dataProvider = chartData2; 
      chart.marginLeft = 10; 
      chart.categoryField = "year"; 
      chart.dataDateFormat = "JJ:NN:SS"; 
      //chart.addListener("dataUpdated", zoomChart); 

      // AXES 
      // category 
      var categoryAxis = chart.categoryAxis; 
      categoryAxis.parseDates = true; 
      categoryAxis.minPeriod = "100"; 
      categoryAxis.dashLength = 3; 
      categoryAxis.minorGridEnabled = true; 
      categoryAxis.minorGridAlpha = 0.1; 

      // value 
      var valueAxis = new AmCharts.ValueAxis(); 
      valueAxis.id = "ax1"; 
      valueAxis.axisAlpha = 0; 
      valueAxis.inside = true; 
      valueAxis.dashLength = 3; 
      valueAxis.position = "right"; 
      chart.addValueAxis(valueAxis); 

      var valueAxis2 = new AmCharts.ValueAxis(); 
      valueAxis2.id = "ax2"; 
      valueAxis2.axisAlpha = 0; 
      valueAxis2.inside = true; 
      valueAxis2.dashLength = 3; 
      valueAxis2.baseValue = -20; 
      valueAxis2.position = "left"; 
      chart.addValueAxis(valueAxis2); 

      // GRAPH 
      graph = new AmCharts.AmGraph(); 
      graph.valueaxis = "ax1"; 
      graph.type = "smoothedLine"; 
      graph.lineColor = "#d1655d"; 
      graph.negativeLineColor = "#637bb6"; 
      graph.bullet = "square"; 
      graph.bulletSize = 8; 
      graph.bulletBorderColor = "#FFFFFF"; 
      graph.bulletBorderAlpha = 1; 
      graph.bulletBorderThickness = 2; 
      graph.lineThickness = 2; 
      graph.valueField = "v1"; 
      graph.title = "title v1"; 
      graph.balloonText = "[[category]]<br><b><span style='font-size:14px;'>[[value]]</span></b>"; 
      chart.addGraph(graph); 

      graph2 = new AmCharts.AmGraph(); 
      graph2.valueAxis = "ax2"; 
      graph2.type = "smoothedLine"; 
      graph2.lineColor = "#d1655d"; 
      graph2.negativeLineColor = "#637bb6"; 
      graph2.bullet = "round"; 
      graph2.bulletSize = 8; 
      graph2.bulletBorderColor = "#FFFFFF"; 
      graph2.bulletBorderAlpha = 1; 
      graph2.bulletBorderThickness = 2; 
      graph2.lineThickness = 2; 
      graph2.valueField = "v2"; 
      graph2.title = "title v2"; 
      graph2.balloonText = "[[category]]<br><b><span style='font-size:14px;'>[[value]]</span></b>"; 
      chart.addGraph(graph2); 

      // CURSOR 
      var chartCursor = new AmCharts.ChartCursor(); 
      chartCursor.cursorAlpha = 0; 
      chartCursor.cursorPosition = "mouse"; 
      chartCursor.categoryBalloonDateFormat = "JJ:NN:SS"; 
      chart.addChartCursor(chartCursor); 

      // SCROLLBAR 
      var chartScrollbar = new AmCharts.ChartScrollbar(); 
      chart.addChartScrollbar(chartScrollbar); 

      chart.creditsPosition = "bottom-right"; 

      // WRITE 
      chart.write("chartdiv2"); 
     }); 

我可以看到的值的x和y轴,但没有线。谁能帮帮我吗?

回答

1

两个问题:

  1. dataDateFormat是不正确,应该是:chart.dataDateFormat = "YYYY-MM-DD JJ:NN:SS";
  2. minPeriod是不正确,应该是:categoryAxis.minPeriod = "ss";
+0

太好了!非常感谢你! – knuppel 2014-11-04 07:06:38