amCharts变速箱未加载

Question

堆上的第一个问题。试图让zoomToDates在我正在开发的amCharts中工作。我已经尝试了其他的解决办法，我可以找到其他人的问题，但没有任何效果。所以不用再纠缠了..。

Resources:
//www.amcharts.com/lib/3/amcharts.js
//www.amcharts.com/lib/3/serial.js
//www.amcharts.com/lib/3/amstock.js
//www.amcharts.com/lib/3/themes/black.js
//www.amcharts.com/lib/3/plugins/export/export.min.js
//www.amcharts.com/lib/3/plugins/export/export.css
//www.amcharts.com/lib/3/plugins/dataloader/dataloader.min.js

HTML:
<div id="$CHART$" style="width: 100%; height: 450px;"></div>

JS:
AmCharts.makeChart( "$CHART$", {
    "type": "stock",
    "theme": "black",
    "categoryAxesSettings.equalSpacing": true,
    "dataDateFormat":"YYYY-MM-DD",
    "valueAxes": [ {
      "position": "left",
    } ],

    "dataSets": [ {
            "title": "Bond",
            "fieldMappings": [ {
                "fromField": "open",
                "toField": "open"
            }, {
                "fromField": "high",
                "toField": "high"
            }, {
                "fromField": "low",
                "toField": "low"
            }, {
                "fromField": "close",
                "toField": "close"
            } ],
            "dataLoader": {
                    "url": "removed for stackoverflow post"
            },
            "categoryField": "date"
        },
    ],

    panels: [ {
            title: "Security",
            percentHeight: 100,
            stockGraphs: [ {
                "valueField": "security",
                "type": "candlestick",
                "showBalloon": true,
                                "proCandlesticks": true,
                        "balloonText": "Open:<b>[[open]]</b><br>Low:<b>[[low]]</b><br>High:<b>[[high]]</b><br>Close:<b>[[close]]</b><br>",
                        "closeField": "close",
                        "fillColors": "#7f8da9",
                        "highField": "high",
                        "lineColor": "#7f8da9",
                        "lineAlpha": 1,
                        "lowField": "low",
                        "fillAlphas": 0.9,
                        "negativeFillColors": "#db4c3c",
                        "negativeLineColor": "#db4c3c",
                        "openField": "open",
            } ],

            stockLegend: {
                periodValueTextRegular: "[[security.close]]"
            }
        }
    ],
    chartScrollbarSettings: {
        graph: "g1"
    },
    chartCursorSettings: {
        valueBalloonsEnabled: true
    },


chart.addListener("rendered", zoomChart);
zoomChart();
function zoomChart() {
    event.chart.zoomToDates(new Date(2017, 10, 22), new Date(2017, 10, 25));
}
});

任何帮助都会很感激的。我已经花了很长时间去做这件事了，不能承认。谢谢。

Answer 1

看起来，您正在使用的AmCharts Wordpress插件通过$CHART认证。主要问题是您的AmCharts.makeChart调用的语法-您的addListener代码在配置中，而它应该完全在调用之外。您也没有引用实际图表实例，也没有正确使用事件参数，例如：

var $CHART$ = AmCharts.makeChart("$CHART$", {
  // ...
});

$CHART$.addListener("rendered", zoomChart);

function zoomChart(event) {
    event.chart.zoom(new Date(2017, 10, 22), new Date(2017, 10, 25));
};

您还必须对股票图表使用zoom，因为zoomToDates不能工作。

理想情况下，您应该使用listeners数组而不是addListener，因为有时会遇到诸如rendered这样的事件在调用addListener之前触发的计时问题：

AmCharts.makeChart("$CHART$", {
  // all of your other config and data omitted
  "listeners": [{
    "event": "rendered",
    "method": function(event) {
      event.chart.zoom(new Date(2017, 10, 22), new Date(2017, 10, 25));
    }
  }]
});