1

携帯電話とタブレットの異なる解像度を識別するためにメディアクエリを使用しています。私のビューは、携帯電話かタブレットかによって異なります。デバイスが携帯電話の場合、ナビゲーションバーで読み込まれる別のページにハイチャート チャートを表示したいのですが、タブレットを使用している場合は、チャートが必要です。最初のページに表示されます。

これを行い、最高のパフォーマンスを得る最善の方法が何であるかはわかりません。私が使用しているグラフは、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 番目のページではロードされません。関数を 2 回呼び出したくない場合は、それがより良い方法です。あなたが私を助けてくれることを願っています。よろしく。

4

1 に答える 1

1

タブレットや携帯電話のページの html を正確に変更しないでください。表示されていない場合でも、両方のページの html があるかどうかを確認してください。ここが本題かもしれません。

ただし、できることは、携帯電話ページとタブレットページの両方のコンテナーの名前を変更することです (例: containerCellPhonecontainerTablet)。renderToデバイスの種類を検出したら、それに応じてプロパティを変更してハイチャート コードを実行します。

あなたの問題を正しく理解できたことを願っています。

于 2012-12-29T05:41:58.590 に答える