Question

目前图表中有一个导出按钮，默认为AmCharts选项，但我需要从外部按钮执行此操作。

示例：`exportConfig：{ menuTop：“21px”， menuBottom：“auto”， menuRight：“21px”， backgroundColor：“＃efefef”，

                menuItemStyle   : {
                backgroundColor         : '#EFEFEF',
                rollOverBackgroundColor : '#DDDDDD'},

                menuItems: [{
                    textAlign: 'center',
                    icon: 'http://www.amcharts.com/lib/3/images/export.png',
                    onclick:function(){},
                    items: [{
                        title: 'JPG',
                        format: 'jpg'
                    }, {
                        title: 'PNG',
                        format: 'png'
                    }, {
                        title: 'SVG',
                        format: 'svg'
                    }]
                }]
            }
        });`

http://jsfiddle.net/BGuuT/

我需要这个功能来导出页面内的按钮点击但不在图表中。

Answer 1

确定可以，您可以像这样手动创建导出实例。导出回调包含blob，在这种情况下是图像的基本64数据字符串。

var tmp = new AmCharts.AmExport(chart);
tmp.init();
tmp.output({
    output: 'datastring',
    format: 'jpg'
},function(blob) {
    var image = new Image();
    image.src = blob;

    document.body.appendChild(image);
});

这里是更新的jsfiddle版本，我希望我可以帮助你 http://jsfiddle.net/BGuuT/1/

Answer 2

另一件事，当你运行代码时，我在代码中看到了这个错误。

这是我的代码。

        <?php
    session_start();
    require_once('../../core.php');
    ?>
    <script type="text/javascript">
    AmCharts.loadJSON = function(url) {
      // create the request
      if (window.XMLHttpRequest) {
        // IE7+, Firefox, Chrome, Opera, Safari
        var request = new XMLHttpRequest();
      } else {
        // code for IE6, IE5
        var request = new ActiveXObject('Microsoft.XMLHTTP');
      }

      // load it
      // the last "false" parameter ensures that our code will wait before the
      // data is loaded
      request.open('GET', url, false);
      request.send();

      // parse adn return the output
      return eval(request.responseText);
    };
    </script>


    <div id="chartdiv"></div>

    <input type="button" name="JPG" id="JPG" value="JPG" />




    <script>
    var graphData = AmCharts.loadJSON('Aplicacion/MGI/generaGraph.php?option=3&instancia=40');
    var chartData = AmCharts.loadJSON('Aplicacion/MGI/generaData.php?instancia=40&FiltroIC=1&FiltroCA=1&FiltroIICG=1');
    var chart = AmCharts.makeChart("chartdiv", {
                "graphs": graphData,
                "pathToImages": "Aplicacion/MGI/amchart/images/",
                "dataProvider": chartData,
                "type": "serial",
                "theme": "light",
                "startDuration": 0.8,
                "legend": {        
                    "position": "bottom",
                    "fontSize": 9
                },
                "valueAxes": [{
                    "stackType": "regular",
                    "fontSize": 9,
                    "ignoreAxisWidth": true             
                }],
                "marginLeft": 40,

                "chartcrollbar": {},
                "chartCursor": {
                    "cursorPosition": "mouse"
                },
                "categoryField": "EjeX",
                "categoryAxis": {
                    "gridPosition": "start",
                    "fillAlpha": 0.05,
                    "labelsEnabled":1,
                    "fillColor": "#000000",
                    "fontSize": 9,
                    "labelRotation": 45
                }
            });
        var btn = document.getElementById('JPG');
    btn.onclick = function() {
    var tmp = new AmCharts.AmExport(chart);
    tmp.init();
    tmp.output({
        output: 'datastring',
        format: 'jpg'
    },function(blob) {
        var image = new Image();
        image.src = blob;
        document.body.appendChild(image);
    });
}
    }




    </script>

这是错误

TypeError: tmp.init is not a function


tmp.init();

Answer 3

我可以问为什么你不希望导出按钮成为默认方法（图表的一部分）？图标不会随图表一起导出，如果这是你担心的，你可以将图标放在图形区域之外，这样就不会干扰正在显示的图形。

如何从外部按钮导出图形AmCharts？

3 个答案: