不知道如何實施射程

Question

我正在使用amcharts插件來創建漂亮的圖表。 我發現了一些添加范圍的方法，但是圖表代碼的結構與我的不同，並且我似乎無法找到如何用我的代碼實現它的方法。 這是我設置圖表的方式。

 var chartConfig = { "type": "serial", "theme": "none", "marginLeft": 70, "dataDateFormat": "YYYY-MM-DD", "graphs": [{ "bullet": "round", "bulletBorderAlpha": 1, "bulletColor": "#FFFFFF", "bulletSize": 5, "hideBulletsCount": 50, "lineThickness": 2, "title": "red line", "useLineColorForBulletBorder": true, "valueField": "value" }], "chartCursor": { "categoryBalloonEnabled": false }, "categoryField": "date", "categoryAxis": { "parseDates": true, "dashLength": 1, "minorGridEnabled": true, "labelsEnabled": false, "tickLength": 0 }, "valueAxes": [{ "ignoreAxisWidth": true }], var charts = []; charts.push(AmCharts.makeChart("chartdiv", chartConfig)); charts.push(AmCharts.makeChart("chartdiv2", chartConfig2)); charts.push(AmCharts.makeChart("chartdiv3", chartConfig3)); for (var x in charts) { charts[x].addListener("zoomed", syncZoom); charts[x].addListener("init", addCursorListeners); } function addCursorListeners(event) { event.chart.chartCursor.addListener("changed", handleCursorChange); event.chart.chartCursor.addListener("onHideCursor", handleHideCursor); } function syncZoom(event) { for (x in charts) { if (charts[x].ignoreZoom) { charts[x].ignoreZoom = false; } if (event.chart != charts[x]) { charts[x].ignoreZoom = true; charts[x].zoomToDates(event.startDate, event.endDate); } } } function handleCursorChange(event) { for (var x in charts) { if (event.chart != charts[x]) { charts[x].chartCursor.syncWithCursor(event.chart.chartCursor); } } } function handleHideCursor() { for (var x in charts) { if (charts[x].chartCursor.hideCursor) { charts[x].chartCursor.forceShow = false; charts[x].chartCursor.hideCursor(false); } } } 

有人知道如何在我的情況下實現范圍嗎？ 提前致謝！

Answer 1

由於您使用的是v3，因此我假設您指的是guides 。 軸范圍是v4功能，可以完成相同的操作。

可以通過指定起點/終點，填充，線條顏色和可選文本來將參考線添加到圖表對象。 如果要在類別軸上繪制參考線，請使用date / toDate或category / toCategory 。 如果要在值軸上繪制參考線，請使用value / toValue ：

guides: [{
  //date-based category axis guide
  date: "2019-02-20", 
  toDate: "2019-02-22",
  fillAlpha: .20,
  fillColor: "#ee7d01",
  label: "Category Axis guide",
  inside: true //move label inside instead of displaying it on the axis
}, {
  //value axis guide
  value: 10,
  toValue: 30,
  fillAlpha: .20,
  fillColor: "#10d7ee",
  label: "Value Axis guide",
  inside: false //keep label outside along the axis
}]

Codepen