Question

我的图形有问题。由于某些原因，不显示值轴标签。例如：https://jsfiddle.net/stj7yzgd/1/。

实际上，可以通过添加以下内容来显示它们：

"panelsSettings": {
    "marginLeft": 40,
}

或通过将显示选项设置为：

"valueAxesSettings": {
    "inside": false
}

对我来说，添加静态余量似乎不是一个好的解决方案，因为它不能适用于所有数字。如果值轴标签将是一个巨大的数字，那么它将被裁剪掉。

此外，我也不想在图形中显示标签，因为它看起来不太好。

有没有更好的解决方案来显示呢？

Answer 1

您可以在autoMargins中将panelsSettings设置为true，以使其自动调整面板大小；它没有记录，但是几乎每个StockPanel级别的设置都可以在panelSettings中进行设置，不幸的是，并没有指出在Settings对象中将其关闭。

panelsSettings: {
  // ...
  autoMargins: true,
  // ...
}

下面的演示

var chart;

function generateChart(dataProvider) {
  chart = AmCharts.makeChart("chartdiv", {
    "type": "stock",
    "dataSets": [{
      "fieldMappings": [{
        "fromField": "visits",
        "toField": "visits"
      }],
      "categoryField": "date",
      "dataProvider": dataProvider,
    }],
    "categoryAxesSettings": {
      "alwaysGroup": true,
      "groupToPeriods": ["hh"],
    },
    "panels": [{
      "stockGraphs": [{
        "type": "column",
        "valueField": "visits",
        "periodValue": "Sum",
      }]
    }],
    "valueAxesSettings": {
      "inside": false,
      "minimum": 0,
    },
    "panelsSettings": {
      "autoMargins": true
    }
  });
}

function generateChartData() {
  var chartData = [];
  var firstDate = new Date();
  firstDate.setDate(firstDate.getDate() - 5);

  for (var i = 0; i < 15; i++) {
    var newDate = new Date(firstDate);
    newDate.setHours(newDate.getHours() + i);

    chartData.push({
      "date": newDate,
      "visits": Math.floor(Math.random() * 100) + 1
    });
  }

  return chartData;
}

generateChart(generateChartData());

#chartdiv {
  width: 100%;
  height: 500px;
}

<div id="chartdiv"> </div>

<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/amstock.js"></script>
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />

不显示值轴标签

1 个答案: