Javascript 浏览器检查器控制台与源代码

Question

这是我的问题：我在玩 ECharts JavaScript 库，我想检索图像数据（我知道有一个另存为图像工具箱）。当我尝试访问函数 getDataUrl 或 getConnectedDataUrl 时，出现以下错误：

"myChart.getDataUrl is not a function"

但是当我尝试在浏览器（或 Firebug）控制台上执行相同操作时，我得到了我想要的信息。当我在控制台上调用 get_data() 时，也会出现我之前提到的错误。我很困惑。

我做错了什么？

有示例代码：

<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <button type="button" onclick="get_data()">holi</button>

        <div id="main" style="width:400px;height:300px;"></div>
        <script src="echarts.min.js"></script>
        <script type="text/javascript">
            // based on prepared DOM, initialize echarts instance
            var myChart = echarts.init(document.getElementById('main'));

            // specify chart configuration item and data
            var option = {
                title: {
                    text: 'Test'
                },
                tooltip: {},
                legend: {
                    data:['Cosas']
                },
                xAxis: {
                    data: ["asdf","qwerty","lol"]
                },
                yAxis: {},
                series: [{
                    name: 'Cosas',
                    type: 'bar',
                    data: [1, 3, 5]
                }],
                toolbox: {
                    show : true,
                    feature : {
                        mark : {show: false},
                        saveAsImage : {show: true, title: "save"}
                    }
                }
            };

            // use configuration item and data specified to show chart
            myChart.setOption(option);

            function get_data(){
                return myChart.getConnectedDataUrl();
            };
        </script>
    </body>
</html>

Answer 1

您只是拼错了函数名称。它们被称为 getDataURL() 和 getConnectedDataURL()（大写 URL）。

Javascript 浏览器检查器控制台与源代码

Javascript browser inspector console vs source code

javascript

firebug

echarts