1. 程式人生 > >echarts自定義提示框 tooptip

echarts自定義提示框 tooptip

echarts中tooltip引數介紹的 官方文件地址: http://echarts.baidu.com/option.html#tooltip.extraCssText

地圖中提示框的自定義,參考: https://blog.csdn.net/bear_lam/article/details/79387934

echarts資料視覺化tooltip提示框詳解,參考: https://blog.csdn.net/luanpeng825485697/article/details/76738435

 

 

附上:

echarts中tooptip的可用引數及說明:

Echarts資料視覺化tooltip提示框詳解:
tooltip ={                                      //提示框元件
    trigger: 'item',                            //觸發型別,'item'資料項圖形觸發,主要在散點圖,餅圖等無類目軸的圖表中使用。 'axis'座標軸觸發,主要在柱狀圖,折線圖等會使用類目軸的圖表中使用。
    triggerOn:"mousemove",                      //提示框觸發的條件,'mousemove'滑鼠移動時觸發。'click'滑鼠點選時觸發。'mousemove|click'同時滑鼠移動和點選時觸發。'none'不在 'mousemove' 或 'click' 時觸發
    showContent:true,                           //是否顯示提示框浮層
    alwaysShowContent:true,                     //是否永遠顯示提示框內容
    showDelay:0,                                  //浮層顯示的延遲,單位為 ms
    hideDelay:100,                                //浮層隱藏的延遲,單位為 ms
    enterable:false,                             //滑鼠是否可進入提示框浮層中
    confine:false,                               //是否將 tooltip 框限制在圖表的區域內
    transitionDuration:0.4,                      //提示框浮層的移動動畫過渡時間,單位是 s,設定為 0 的時候會緊跟著滑鼠移動
    position:['50%', '50%'],                    //提示框浮層的位置,預設不設定時位置會跟隨滑鼠的位置,[10, 10],回掉函式,inside滑鼠所在圖形的內部中心位置,top、left、bottom、right滑鼠所在圖形上側,左側,下側,右側,
    formatter:"{b0}: {c0}<br />{b1}: {c1}",     //提示框浮層內容格式器,支援字串模板和回撥函式兩種形式,模板變數有 {a}, {b},{c},{d},{e},分別表示系列名,資料名,資料值等
    backgroundColor:"transparent",            //標題背景色
    borderColor:"#ccc",                        //邊框顏色
    borderWidth:0,                              //邊框線寬
    padding:5,                                  //圖例內邊距,單位px  5  [5, 10]  [5,10,5,10]
    textStyle:mytextStyle,                     //文字樣式
};
--------------------- 

原文:https://blog.csdn.net/luanpeng825485697/article/details/76738435