我的图表出了什么问题?我使用的是谷歌图表api

what is wrong with my chart? i am using google chart api

本文关键字：api 谷歌 什么 问题 我的      更新时间：2023-09-26

如红色箭头所示。为什么它在图表中显示-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行出现

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

vAxis: {viewWindow: {min: 0}}

所以它看起来是这样的：

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

我不知道为什么它一开始就显示-25线。我认为这是由于inCount中的值3，它足够低，可以使图表显示负值。

相关文章：