Question

如红色箭头所示。为什么它在图表中显示-25行

我使用的是javascript。

<!DOCTYPE html>
<html>
<head> <meta http-equiv="refresh" content="30" />
    <title>Analytics of Payment Service</title>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
        google.load("visualization", "1", {
  packages: ["corechart", "bar"]
});
google.setOnLoadCallback(function(){
    drawChart2()
})



function drawChart2() {


var listOfDataCC  =$!{dataForCCInvoice}

  var outputArrayForInvoiceAndCredit = new Array();
// header
var headerArray1 = ['Day', 'cc', 'In'];
outputArrayForInvoiceAndCredit.push(headerArray1);
for (var i = 0; i < listOfDataCC.length; i++){
    var obj1 = listOfDataCC[i];
    var innerArray = new Array();
    innerArray[0] = obj1.date;
    innerArray[1] = obj1.CCount;
    innerArray[2] = obj1.inCount;
    outputArrayForInvoiceAndCredit.push(innerArray);
}


  var data2 = google.visualization.arrayToDataTable(outputArrayForInvoiceAndCredit);

  var options2 = {
    title: 'CC/In Details',
    curveType: 'function',
    legend: {
      position: 'bottom'
    }
  };

  var chart2 = new google.visualization.LineChart(document.getElementById('cc/in'));

  chart2.draw(data2, options2);
}

</script>

</head>
<body>

<div id="cc/in" style="width: 900px; height: 500px"></div>

</body>
</html>

$！{dataForCCInvoice}的值是json格式的值。 json值是。

[
  {
    "date": "15-APR-16",
    "CCount": 38,
    "inCount": 18
},
{
    "date": "16-APR-16",
    "CCount": 9,
    "inCount": 14
},
{
    "date": "17-APR-16",
    "CCount": 9,
    "inCount": 3
},
{
    "date": "18-APR-16",
    "CCount": 52,
    "inCount": 44
},
{
    "date": "19-APR-16",
    "CCount": 59,
    "inCount": 44
},
{
    "date": "20-APR-16",
    "CCount": 9,
    "inCount": 7
  }
]

我在这里缺少什么。有时其工作正常，但不知道为什么-25线出现

Answer 1

要解决此问题，您可以在选项中添加以下内容：

vAxis: {viewWindow: {min: 0}}

所以它看起来像这样：

var options2 = {
    title: 'CC/In Details',
    curveType: 'function',
    legend: {
        position: 'bottom'
    },
    vAxis: {
        viewWindow: {
            min: 0
        }
    }
};

我不知道为什么它首先显示-25行。我认为这是因为inCount中的值为3，这足以使图表显示负值。

我的图表出了什么问题？我正在使用谷歌图表API

1 个答案: