プロットグラフの応答iframeを埋め込む方法は？

Question

私は円グラフをwebpageに埋め込むようにしています。私は応答するiframeが欲しかったので、私はthis toolを使ってhtml/cssを生成しました。結果はラップトップでは問題なく見えますが、携帯電話のポートレートモードでは円グラフがほとんど表示されません。どうすれば修正できますか？円グラフはどの画面でも大きく見えるようになります。

<style>.embed-container { position: relative; padding-bottom: 56.25%;  
height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, 
.embed-container object, .embed-container embed { position: absolute; 
top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'> 
<iframe frameborder='0' scrolling='no' 
src='//plot.ly/~bluprince13/3.embed?autosize=true&link=false&modebar=false&width=100%'></iframe></div> 

そしてスクリーンショット：ここ

はコードであることだ...

Answer 1

残念ながら、それが応答作品を埋め込む方法です左は何もないまでになります。..しかし、（私の方法は最適ではないかもしれませんが）設定幅後にサイズの縮小をストールするために最小幅と最小幅を使用しました...これをチェックアウト：

Codepenリンク：https://codepen.io/anon/pen/KZMJER?editors=1100

div { 
    min-width: 280px; 
    min-height: 280px; 
} 

また、あなただけの提案...代わりにCSSコードのブートストラップの埋め込み応答iframe対応を使用することができます...

<div class="embed-responsive embed-responsive-4by3"> 
    <iframe frameborder='0' scrolling='no' src='//plot.ly/~bluprince13/3.embed?autosize=true&link=false&modebar=false&width=100%' class="embed-responsive-item" style="border:none;" ></iframe> 
</div>