av激情亚洲男人的天堂国语,日韩欧美精品一中文字幕,无码av一区二区三区无码,国产又色又爽又刺激的a片,国产又色又爽又刺激的a片

創(chuàng)新互聯(lián)ECharts教程：ECharts單軸中tooltip如何設(shè)置

ECharts 中提示框組件可以在多種地方使用，如：

創(chuàng)新互聯(lián)是一家集網(wǎng)站建設(shè),沭陽(yáng)企業(yè)網(wǎng)站建設(shè),沭陽(yáng)品牌網(wǎng)站建設(shè),網(wǎng)站定制,沭陽(yáng)網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷(xiāo),網(wǎng)絡(luò)優(yōu)化,沭陽(yáng)網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力?？沙浞譂M(mǎn)足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專(zhuān)業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶(hù)成長(zhǎng)自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

  • 可以設(shè)置在全局，即 tooltip
  • 可以設(shè)置在坐標(biāo)系中，即 grid.tooltip、polar.tooltip、single.tooltip
  • 可以設(shè)置在系列中，即 series.tooltip
  • 可以設(shè)置在系列的每個(gè)數(shù)據(jù)項(xiàng)中，即 series.data.tooltip

singleAxis.tooltip   |   *

用于設(shè)置 ECharts 單軸的特定的 tooltip 設(shè)置。

singleAxis.tooltip.show   |   boolean

[ default: true ]

是否顯示提示框組件，包括提示框浮層和 axisPointer。

singleAxis.tooltip.trigger   |   string

[ default: 'item' ]

觸發(fā)類(lèi)型。

可選：

  • 'item'數(shù)據(jù)項(xiàng)圖形觸發(fā)，主要在散點(diǎn)圖，餅圖等無(wú)類(lèi)目軸的圖表中使用。
  • 'axis'坐標(biāo)軸觸發(fā)，主要在柱狀圖，折線圖等會(huì)使用類(lèi)目軸的圖表中使用。在 ECharts 2.x 中只支持類(lèi)目軸上使用 axis trigger，在 ECharts 3 中支持在直角坐標(biāo)系和極坐標(biāo)系上的所有類(lèi)型的軸。并且可以通過(guò) axisPointer.axis 指定坐標(biāo)軸。
  • 'none'什么都不觸發(fā)。

singleAxis.tooltip.position   |   string, Array, Function

提示框浮層的位置，默認(rèn)不設(shè)置時(shí)位置會(huì)跟隨鼠標(biāo)的位置。

可選：

  • Array
    通過(guò)數(shù)組表示提示框浮層的位置，支持?jǐn)?shù)字設(shè)置絕對(duì)位置，百分比設(shè)置相對(duì)位置。
    示例:  
    // 絕對(duì)位置，相對(duì)于容器左側(cè) 10px, 上側(cè) 10 px
position: [10, 10]
// 相對(duì)位置，放置在容器正中間
position: ['50%', '50%']
  • Function
    回調(diào)函數(shù)，格式如下: 
    (point: Array, params: Object|Array., dom: HTMLDomElement, rect: Object, size: Object) => Array
    參數(shù)： 
    point: 鼠標(biāo)位置，如 [20, 40]。 
    params: 同 formatter 的參數(shù)相同。 
    dom: tooltip 的 dom 對(duì)象。 
    rect: 只有鼠標(biāo)在圖形上時(shí)有效，是一個(gè)用x, y, width, height四個(gè)屬性表達(dá)的圖形包圍盒。 
    size: 包括 dom 的尺寸和 echarts 容器的當(dāng)前尺寸，例如：{contentSize: [width, height], viewSize: [width, height]}。 
    返回值：可以是一個(gè)表示 tooltip 位置的數(shù)組，數(shù)組值可以是絕對(duì)的像素值，也可以是相 百分比。 
    也可以是一個(gè)對(duì)象，如：{left: 10, top: 30}，或者 {right: '20%', bottom: 40}。 
    如下示例： 
    position: function (point, params, dom, rect, size) { 
// 固定在頂部 
return [point[0], '10%']; 
} 
    或者： 
    position: function (pos, params, dom, rect, size) { 
// 鼠標(biāo)在左側(cè)時(shí) tooltip 顯示到右側(cè)，鼠標(biāo)在右側(cè)時(shí) tooltip 顯示到左側(cè)。 
var obj = {top: 60}; 
obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5; 
return obj; 
}
    



      

    • 'inside' 
      鼠標(biāo)所在圖形的內(nèi)部中心位置，只在 trigger 為'item'的時(shí)候有效。
      • 

    • 'top' 
      鼠標(biāo)所在圖形上側(cè)，只在 trigger 為'item'的時(shí)候有效。
      • 

    • 'left' 
      鼠標(biāo)所在圖形左側(cè)，只在 trigger 為'item'的時(shí)候有效。
      • 

    • 'right' 
      鼠標(biāo)所在圖形右側(cè)，只在 trigger 為'item'的時(shí)候有效。
      • 

    • 'bottom' 
      鼠標(biāo)所在圖形底側(cè)，只在 trigger 為'item'的時(shí)候有效。
    singleAxis.tooltip.formatter   |   string, Function
    

    提示框浮層內(nèi)容格式器，支持字符串模板和回調(diào)函數(shù)兩種形式。
      

    1. 字符串模板 
       

      模板變量有 {a}, ，{c}，xznphnt，{e}，分別表示系列名，數(shù)據(jù)名，數(shù)據(jù)值等。 在 trigger 為 'axis' 的時(shí)候，會(huì)有多個(gè)系列的數(shù)據(jù)，此時(shí)可以通過(guò) {a0}, {a1}, {a2} 這種后面加索引的方式表示系列的索引。 不同圖表類(lèi)型下的 {a}，，{c}，z7zz5bv 含義不一樣。 其中變量{a}, , {c}, jvzb75n在不同圖表類(lèi)型下代表數(shù)據(jù)含義為：
        

      • 折線（區(qū)域）圖、柱狀（條形）圖、K線圖 : {a}（系列名稱(chēng)），（類(lèi)目值），{c}（數(shù)值）, drvzr55（無(wú)）
        • 

      • 散點(diǎn)圖（氣泡）圖 : {a}（系列名稱(chēng)），（數(shù)據(jù)名稱(chēng)），{c}（數(shù)值數(shù)組）, fz5pp7l（無(wú)）
        • 

      • 地圖 : {a}（系列名稱(chēng)），（區(qū)域名稱(chēng)），{c}（合并數(shù)值）, 7xxj5j5（無(wú)）
        • 

      • 餅圖、儀表盤(pán)、漏斗圖: {a}（系列名稱(chēng)），（數(shù)據(jù)項(xiàng)名稱(chēng)），{c}（數(shù)值）, thpvdb5（百分比）
        • 

      

      更多其它圖表模板變量的含義可以見(jiàn)相應(yīng)的圖表的 label.normal.formatter 配置項(xiàng)。
      示例：
      formatter: '{b0}: {c0}
      {b1}: {c1}'
      

      2. 

    2. 回調(diào)函數(shù)
      3. 

      回調(diào)函數(shù)格式：
      (params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string
      第一個(gè)參數(shù) params 是 formatter 需要的數(shù)據(jù)集。格式如下：  
      {
    componentType: 'series',
    // 系列類(lèi)型
    seriesType: string,
    // 系列在傳入的 option.series 中的 index
    seriesIndex: number,
    // 系列名稱(chēng)
    seriesName: string,
    // 數(shù)據(jù)名，類(lèi)目名
    name: string,
    // 數(shù)據(jù)在傳入的 data 數(shù)組中的 index
    dataIndex: number,
    // 傳入的原始數(shù)據(jù)項(xiàng)
    data: Object,
    // 傳入的數(shù)據(jù)值
    value: number|Array,
    // 數(shù)據(jù)圖形的顏色
    color: string,
    // 餅圖的百分比
    percent: number,
    // 
    galleryViewPath: ,
    // 
    galleryEditorPath: ,
    // 
    imagePath: ,
    // 
    gl: ,
}
      在 trigger 為 'axis' 的時(shí)候，或者 tooltip 被 axisPointer 觸發(fā)的時(shí)候，params 是多個(gè)系列的數(shù)據(jù)數(shù)組。其中每項(xiàng)內(nèi)容格式同上，并且，
      {
      
    componentType: 'series',
      
    // 系列類(lèi)型
      
    seriesType: string,
      
    // 系列在傳入的 option.series 中的 index
      
    seriesIndex: number,
      
    // 系列名稱(chēng)
      
    seriesName: string,
      
    // 數(shù)據(jù)名，類(lèi)目名
      
    name: string,
      
    // 數(shù)據(jù)在傳入的 data 數(shù)組中的 index
      
    dataIndex: number,
      
    // 傳入的原始數(shù)據(jù)項(xiàng)
      
    data: Object,
      
    // 傳入的數(shù)據(jù)值
      
    value: number|Array,
      
    // 數(shù)據(jù)圖形的顏色
      
    color: string,
      

}
      

      注： ECharts 2.x 使用數(shù)組表示各參數(shù)的方式不再支持。
      第二個(gè)參數(shù) ticket 是異步回調(diào)標(biāo)識(shí)，配合第三個(gè)參數(shù) callback 使用。 第三個(gè)參數(shù) callback 是異步回調(diào)，在提示框浮層內(nèi)容是異步獲取的時(shí)候，可以通過(guò) callback 傳入上述的 ticket 和 html 更新提示框浮層內(nèi)容。
      示例：
      formatter: function (params, ticket, callback) {
      
    $.get('detail?name=' + params.name, function (content) {
      
        callback(ticket, toHTML(content));
      
    });
      
    return 'Loading';
      
}
      

    

    singleAxis.tooltip.backgroundColor   |   Color
    

    [ default: 'rgba(50,50,50,0.7)' ]
    提示框浮層的背景顏色。
    singleAxis.tooltip.borderColor   |   Color
    

    [ default: '#333' ]
    提示框浮層的邊框顏色。
    singleAxis.tooltip.borderWidth   |   number
    

    [ default: 0 ]
    提示框浮層的邊框?qū)挕?/p>
    singleAxis.tooltip.padding   |   number
    

    [ default: 5 ]
    提示框浮層內(nèi)邊距，單位px，默認(rèn)各方向內(nèi)邊距為5，接受數(shù)組分別設(shè)定上右下左邊距。
    使用示例：
    // 設(shè)置內(nèi)邊距為 5
padding: 5
// 設(shè)置上下的內(nèi)邊距為 5，左右的內(nèi)邊距為 10
padding: [5, 10]
// 分別設(shè)置四個(gè)方向的內(nèi)邊距
padding: [
    5,  // 上
    10, // 右
    5,  // 下
    10, // 左
]
    

    singleAxis.tooltip.extraCssText   |   string
    

    額外附加到浮層的 css 樣式。如下為浮層添加陰影的示例：
    extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'
                        
    
                    標(biāo)題名稱(chēng)：創(chuàng)新互聯(lián)ECharts教程：ECharts單軸中tooltip如何設(shè)置                    
    
                    瀏覽路徑：http://uogjgqi.cn/article/cogicoi.html
                
                
    
                    
    
                    
    
                        
    掃二維碼與項(xiàng)目經(jīng)理溝通
    
                        
    我們?cè)谖⑿派?4小時(shí)期待你的聲音
    
                        
    解答本文疑問(wèn)/技術(shù)咨詢(xún)/運(yùn)營(yíng)咨詢(xún)/技術(shù)建議/互聯(lián)網(wǎng)交流