1

好吧，我正在使用 phonegap 开发应用程序，我正在使用媒体查询来识别手机和平板电脑的不同分辨率。我的观点不同取决于它是手机还是平板电脑，当设备是手机时，我想在加载导航栏的不同页面中显示高图表，当我在平板电脑中时，我想要图表出现在第一页。

我不知道做到这一点并获得最佳性能的最佳方法是什么。我正在使用的图表是 Highcharts 给出的示例：

function graph(){
$(function() {
    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) {
        // Create the chart
        window.chart = new Highcharts.StockChart({
            chart : {
                renderTo : 'container' 
            },
            rangeSelector : {
                selected : 1
            },
            title : {
                text : 'AAPL Stock Price'
            },
            series : [{
                name : 'AAPL',
                data : data,
                tooltip: {
                    valueDecimals: 2
                }
            }]
        });
      });
    });
}

我希望将该图表加载container到第一页中调用的 div 中（如果它是平板电脑），或者加载到具有相同名称但在其他页面中的 div 中（如果它是智能手机）。

实际上，图表仅针对第一页中的平板电脑而不是第二页中的平板电脑加载，如果这是一种更好的方法，我不想调用该函数 2 次。希望您能够帮助我。问候。

4

1 回答 1

1

不要为平板电脑和手机更改页面的 html。即使您没有显示，请检查您是否有两个页面的 html。这可能是这里的问题。

但是，您可以做的是，更改手机页面和平板电脑页面的两个容器的名称（例如containerCellPhone，，containerTablet）。并在检测到设备类型后运行具有相应更改属性的 highchart 代码renderTo。

希望我正确理解了您的问题。

于 2012-12-29T05:41:58.590 回答