Libreria chart per mobile

[fermat]

ciao!

devo creare dei grafici da mettere dentro una mobile web app.
conoscete una libreria specifica per il mobile??
ne ho usate tante in questi anni (d3.js, highchart, chart.js, google chart), ma sempre in ambito "desktop".
non se ce ne è una specifica per il mobile.

[lucavizzi]

Personalmente ho usato Google Chart su un sito responsivo e con qualche piccolo accorgimento si adattano bene.

[fermat]

Personalmente ho usato Google Chart su un sito responsivo e con qualche piccolo accorgimento si adattano bene.

ok allora provo con quello!

[fermat]

per la cronaca, questo funziona.
sto usando framework7 come framewrok mobile:

// JS
myApp.onPageInit('charts', function (page) {
    var w = $$('#dashboard_div ul li').width() - 50;

    google.charts.load('current', {'packages': ['corechart', 'controls']});
    google.charts.setOnLoadCallback(function () {
        var options = {
            'title': '2017',
            'is3D': true,
            'pieSliceText': 'value',
            'legend': 'right',
            'width': w,
            'height': w,
            'backgroundColor': '#1c1d1f',
            legendTextStyle: {color: '#FFF'},
            titleTextStyle: {color: '#FFF'},
            hAxis: {
                color: '#FFF',
            }
        };

        var dataAjax = $$.ajax({
            async: false,
            url: '../ajax/chart_data_mobile.php',
            method: 'POST',
            data: {anno: 2017, tipo: 'E'},
            dataType: 'json'
        }).responseText;
        
        var data = google.visualization.arrayToDataTable(JSON.parse(dataAjax));
        var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div'));
        var donutRangeSlider = new google.visualization.ControlWrapper({
            'controlType': 'NumberRangeFilter',
            'containerId': 'filter_div_e',
            'options': {
                'filterColumnLabel': 'Valore Entrate',
                'ui': {'labelStacking': 'vertical'}
            }
        });
        var pieChart = new google.visualization.ChartWrapper({
            'chartType': 'PieChart',
            'containerId': 'chart_div_e',
            'options': options
        });
        dashboard.bind(donutRangeSlider, pieChart);
        dashboard.draw(data);
    });
});

// HTML
<div class="pages navbar-through toolbar-through">
    <div data-page="charts" class="page">
        <div class="page-content">
            <div class="content-block-title">Charts</div>
            <div class="list-block inset">
                <div id="dashboard_div">
                    <ul>
                        <li>
                            <div id="filter_div_e"></div>
                            <div id="chart_div_e"></div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

ci sono alcune cose da sistemare, ma per lo più funziona.