VUEをドラッグ＆ドロップするときechartsは、適応型ウィンドウをグラフ化

1。

<DIV ID = "cityEchart" REF = "chart222"> 

        </ div>

2.データ

データ（）{
         リターン{ 
            cityEchart：ヌル
        } 
    }、

 

3.方法

citySortEchar（）{
             この .cityEchart = この $ echarts.init（。この$のrefs.chart222。）
             VaRのオプション= { 
                色：[ '線形勾配（e66465＃、＃9198e5）' ]、
                ヒント：{ 
                    トリガ：「軸' 
                    axisPointerは：{             // 軸インジケータが有効なトリガ軸 
                        タイプ：'影'         // デフォルトは、必要に応じて、線形である：'行'|'シャドー'                     } 
                }、
                グリッド：{ 
                    左： 3' ％ '。
、
                    右： '4％' 、
                    底： 3 '％' 、
                    トップ： '16％ ' 
                    containLabel：真へ
                }、
                XAXIS：[ 
                    { 
                        タイプ： 'カテゴリー' 
                        データ：[ '浙江省''江蘇省''河南省' '安徽省'、 '湖北'、 '雲南'、 '江西省' ]、
                        axisTick：{ 
                            alignWithLabel：真へ
                        }、
                        axisLine。{ 
                            ショー：falseに、
                            をlineStyle：{ 
                                色： '＃657CA8' 
                            } 
                        }、
                        分割線：{ 
                            表示：falseに、// 削除グリッド線
                        }、
                        たAxisLabel：{ 
                            表示：trueに、
                            間隔： 0 、
                            TEXTSTYLE：{ 
                                色： '#FFF' 、
                                fontSize：14 
                            } 
                        } 
                    } 
                ]、
                YAXIS：[ 
                    { 
                        名： '番号' 、
                        nameTextStyle：{ 
                            色： '#FFF' 、
                            のfontSize： 14 
                        }、
                        分割線：{ 
                            表示：trueに、// 削除グリッド線
                            をlineStyleを：{ 
                                色： ['RGBA（101,124,168,0.55）']   // グリッド線色 
                                :. 1幅、
                                タイプ： 'ソリッド' 
                            } 
                        }、
                        axisLine：{ 
                            ショー：falseに、// 座標軸を表示しない
                        、} 
                        ：{表示：たAxisLabel trueにし、 0、TEXTSTYLE：{色： '＃のFFF'のfontSize：14間隔}}、
                        タイプ： '値' 
                    } 
                ]、
                シリーズ：[ 
                    {
                        名前： 'ダイレクトアクセス' 、
                        種類： 'バー' 、
                        barWidth： '30％」、    // 列幅
                        ItemStyle：{ 
                            ノーマル：{ 
                                色：新しい新しい 本。echarts.graphic.LinearGradient $（0、0、0、。1 、[{ 
                                    オフセット： 0 、
                                    カラー： '＃1 52C5FFは' 
                                }、{ 
                                    オフセット： 1、
                                    色： '＃228FFE' 
                                }]）
                            } 
                        }、
                        データ： 5522、4487、3700、3544、2844、1944、1345 ] 
                    } 
                ] 
            }。
            この.cityEchart.setOption（オプション）。
            window.addEventListener（ 'リサイズ'、この.resizeHandler） 
        }、resizeHandler（）{
             
        この.cityEchart.resize（）
        }、