ECharts的數(shù)據(jù)視圖工具

toolbox.feature.dataView   |   Object

數(shù)據(jù)視圖工具，可以展現(xiàn)當(dāng)前圖表所用的數(shù)據(jù)，編輯后可以動(dòng)態(tài)更新。

toolbox.feature.dataView.show   |   boolean

[ default: true ]

是否顯示數(shù)據(jù)視圖工具。

toolbox.feature.dataView.title   |   boolean

[ default: '數(shù)據(jù)視圖' ]

數(shù)據(jù)視圖工具的標(biāo)題。

toolbox.feature.dataView.icon   |   *

Icon 的 path 字符串，ECharts 3 中支持使用自定義的 svg path 作為 icon，格式參見 SVG PathData?？梢詮?Adobe Illustrator 等工具編輯導(dǎo)出。

toolbox.feature.dataView.iconStyle   |   Object

數(shù)據(jù)視圖的 icon 樣式設(shè)置。

toolbox.feature.dataView.readOnly   |   boolean

[ default: false ]

數(shù)據(jù)視圖工具是否不可編輯（只讀）。

toolbox.feature.dataView.optionToContent   |   Function

(option:Object) => HTMLDomElement|string

自定義 dataView 展現(xiàn)函數(shù)，用以取代默認(rèn)的 textarea 使用更豐富的數(shù)據(jù)編輯?？梢苑祷?dom 對(duì)象或者 html 字符串。

如下示例使用表格展現(xiàn)數(shù)據(jù)值：

optionToContent: function(opt) {
    var axisData = opt.xAxis[0].data;
    var series = opt.series;
    var table = '<table style="width:100%;text-align:center"><tbody><tr>'
                 + '<td>時(shí)間</td>'
                 + '<td>' + series[0].name + '</td>'
                 + '<td>' + series[1].name + '</td>'
                 + '</tr>';
    for (var i = 0, l = axisData.length; i < l; i++) {
        table += '<tr>'
                 + '<td>' + axisData[i] + '</td>'
                 + '<td>' + series[0].data[i] + '</td>'
                 + '<td>' + series[1].data[i] + '</td>'
                 + '</tr>';
    }
    table += '</tbody></table>';
    return table;
}

toolbox.feature.dataView.contentToOption   |   Function

(container:HTMLDomElement, option:Object) => Object

在使用 optionToContent 的情況下，如果支持?jǐn)?shù)據(jù)編輯后的刷新，需要自行通過(guò)該函數(shù)實(shí)現(xiàn)組裝 option 的邏輯。

toolbox.feature.dataView.lang   |   Array

[ default: ['數(shù)據(jù)視圖', '關(guān)閉', '刷新'] ]

數(shù)據(jù)視圖上有三個(gè)話術(shù)，默認(rèn)是['數(shù)據(jù)視圖', '關(guān)閉', '刷新']。

toolbox.feature.dataView.backgroundColor   |   string

[ default: '#fff' ]

數(shù)據(jù)視圖浮層背景色。

toolbox.feature.dataView.textareaColor   |   string

[ default: '#fff' ]

數(shù)據(jù)視圖浮層文本輸入?yún)^(qū)背景色。

toolbox.feature.dataView.textareaBorderColor   |   string

[ default: '#333' ]

數(shù)據(jù)視圖浮層文本輸入?yún)^(qū)邊框顏色。

toolbox.feature.dataView.textColor   |   string

[ default: '#000' ]

數(shù)據(jù)視圖文本顏色。

toolbox.feature.dataView.buttonColor   |   string

[ default: '#c23531' ]

數(shù)據(jù)視圖按鈕的顏色。

toolbox.feature.dataView.buttonTextColor   |   string

[ default: '#fff' ]

數(shù)據(jù)視圖按鈕文本的顏色。