Android 2.3.x with google charts

Question

In my application I use Google charts.
The problem is that Android 2.3.x browser doesn't support svg.
I got the next error: cannot set property 'overflow' of null

After some research I found this question with reference to canvg

my code:

<div id="Wrapper">      
        <div id="titlewrapper"><div id="title" class="rounded-corners">qwertyuiopasdfghjklzxcvbnm</div></div>
        <div id="chart_div" style="position: relative;">
            <div dir="ltr" style="position: relative; width: 1584px; height: 531px;">
                <div style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;">
                    <svg width="1584" height="531" style="overflow: hidden;">
                        // SVG CONTENT
                    </svg>
                </div>
            </div>
        </div>
    </div>

The Google charts code is added inside #chart_div.
My question is how can I use canvg or any other tool to support the chart in Android 2.3.x browsers?

- Edit: I think to use:

//load '../path/to/your.svg' in the canvas with id = 'canvas'
  canvg('canvas', '../path/to/your.svg')

How to get reference to that SVG?

Answer 1

For dynamic data it's almost impossible see @asgallant answer.
Google charts uses SVG and Android 2.3.x browser doesn't support that.
I found a good canvas based alternatives Flotr2 and Chart.js

Answer 2

If the canvg library you are using is the same one I am thinking of, I believe you can pass a reference to the <svg> element in your DOM to the canvg function:

var svg = document.querySelector('#chart_div svg');
canvg('canvas', svg);

You will probably want to put that in a "ready" event handler for whatever chart you are drawing:

google.visualization.events.addListener(chart, 'ready', function () {
    var svg = document.querySelector('#chart_div svg');
    canvg('canvas', svg);
});

That will only work, however, if the SVG actually gets written to the DOM. I don't know if the Android 2.3.x browser will actually allow the invalid svg element to be written to the DOM.