關於頁面圖表相應式的問題，問題碰見時間，9月1日，到今天9月2日，還沒有解決

首先，我在作公司的新的軟件頁面，後臺頁面，遇到的問題是當我引入百度的echarts.js，想使用他們的插件來實現圖表的功能，發現JS的信息描述必須放在他們div id的下面，不然會失效，這是問題一。

 

如今遇到的問題是解決不了關於圖表在PC端和在手機端顯示的問題，因爲echarts.js的機制，他是須要在

 <div class="am-panel am-panel-default am-u-sm-12">
        <div id="tfe"  class="wutoo" style="min-width: 60rem; min-height:40rem;"></div> 
        </div>

style裏面進行寬度和長度的設置，也就是說，他在DOM裏本身設置了寬度的DOM，這就是問題所在。

我開始尋找網上全部關於響應式頁面的問題，也就是CSS3新屬性，根據頁面寬度來判斷 例如 width的顯示問題，好比這樣

 @media screen and (max-width:700rem){
         div#tfe{
             width: 6rem;height:4rem;
         }
       }
       @media screen and (max-width:1024rem){
         div#tfe{
             width: 60rem;height:40rem;

根據@media screen and來進行媒體判斷寬度，進而實現根據寬度調整DOM的樣式。

可是style是寫在 div裏面的，他的權限高於在css type裏的權限，也就是說，我這麼寫並不能修改圖表的樣式。

 

JS的辦法，直接給寬度設定

網上有個給我推薦了這麼一個方法，可是對我來講不適用，固然，這是一個辦法，能讓我短暫的解決移動端的樣式問題。

<script type="text/javascript">
    let height = window.innerHeight();
    document.docunmentElement.style.fontSize =(height/1080)*100+"px"

</script>

還有一個方法是在百度的API文檔裏找到他們專門在JS的方法，昨天嫌繁瑣，想找個偷懶的辦法，看來今天必須解決這個問題了

手機端的echarts能實現這個功能，也就是說百度已經有了合適的方法，可是我如今就須要從這個地方去進行改變，週六日解決這個問題。