<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="DonutGraph.aspx.vb" Inherits="InovarPAA.DonutGraph" %>

<!DOCTYPE html>

<html style="width:100%; height:100%;">
<head>
    <style>
        #print {
            float: right;
            font-family: Verdana;
            color: #0B62A4;
            font-size: 10px;
            right: 10px;
            bottom: 0;
            position: fixed;
            cursor: pointer;
        }

        a {
            font-family: Verdana;
            float: right;
            font-size: 10px;
            position: fixed;
            right: 80px;
            bottom: 2px;
        }
    </style>

    <!--Load the AJAX API-->
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

        // Load the Visualization API and the piechart package.
        google.load('visualization', '1.0', { 'packages': ['corechart'] });

        // Set a callback to run when the Google Visualization API is loaded.
        google.setOnLoadCallback(drawChart);

        // Callback that creates and populates a data table,
        // instantiates the pie chart, passes in the data and
        // draws it.
        window.onresize = drawChart;

        function drawChart() {

            // Create the data table.
            var data = new google.visualization.DataTable();
            data.addColumn(<%= Column1%>);
            data.addColumn(<%= Column2%>);
            data.addRows(<%= TheData%>);

            // Set chart options
            var options = {
                'title': '<%= Titutlo%>',
                chartArea: { left: '40', height: '80%', width: '80%' },
                is3D: true,
                //slices: {
                //    0: { offset: 0.2 }
                //},
                backgroundColor: {fill: 'white'}
            };

            // Instantiate and draw our chart, passing in some options.
            var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
            chart.draw(data, options);

            document.getElementById('print').onclick = function () {
                //window.open(chart.getImageURI(), "_blank")
                downloadLink = document.createElement('a');
                downloadLink.href = chart.getImageURI();
                downloadLink.download = 'grafico.png';
                downloadLink.click();
            };
        }
    </script>
</head>

<body style="width:100%; height:100%;">
    <div id="chart_div" style="<%=style%>"></div>
    <button id="print">Exportar</button>
    <%=LinkApi%>
</body>
</html>
