// 數據列展示/隱藏的邏輯函數
getVisibleMode(series, serieName) {
? ? var allVisible = true
? ? var allHidden = true
? ? for (let i = 0; i < series.length; i++) {
? ? ? ? if (series[i].name === serieName)
? ? ? ? ? ? continue
? ? ? ? // &= 按位運算用法：a &= b 等價于 a = a & b (值為 0 / 1)
? ? ? ? allVisible &= series[i].visible
? ? ? ? allHidden &= (!series[i].visible)
? ? }
? ? if (allVisible && !allHidden)
? ? ? ? return 'all-visible'
? ? if (allHidden && !allVisible)
? ? ? ? return 'all-hidden'
? ? return 'other-cases'
},
// 繪制圖表的方法
drawChart(id) {
? ? let that = this // 記錄this指向，以便圖例點擊事件中調用方法
? ? Hightcharts.chart(id, {
? ? ? ? ...,
? ? ? ? // hightcharts對應的配置項
? ? ? ? plotOptions : {
? ? ? ? ? ? series: {
? ? ? ? ? ? ? ? events : {
? ? ? ? ? ? ? ? ? ? // 圖例點擊事件
? ? ? ? ? ? ? ? ? ? legendItemClick : function (e) {
? ? ? ? ? ? ? ? ? ? ? ? var series = this.chart.series
? ? ? ? ? ? ? ? ? ? ? ? var mode = that.getVisibleMode(series, this.name)
? ? ? ? ? ? ? ? ? ? ? ? var enableDefault = false
? ? ? ? ? ? ? ? ? ? ? ? if (!this.visible) {
? ? ? ? ? ? ? ? ? ? ? ? ? ? enableDefault = true
? ? ? ? ? ? ? ? ? ? ? ? } else if (mode === 'all-visible') {
? ? ? ? ? ? ? ? ? ? ? ? ? ? series.forEach((serie, k) => {
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? serie.hide()
? ? ? ? ? ? ? ? ? ? ? ? ? ? })
? ? ? ? ? ? ? ? ? ? ? ? ? ? this.show()
? ? ? ? ? ? ? ? ? ? ? ? } else if (mode === 'all-hidden') {
? ? ? ? ? ? ? ? ? ? ? ? ? ? series.forEach((serie, k) => {
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? serie.show()
? ? ? ? ? ? ? ? ? ? ? ? ? ? })
? ? ? ? ? ? ? ? ? ? ? ? } else {
? ? ? ? ? ? ? ? ? ? ? ? ? ? enableDefault = true
? ? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? ? ? return enableDefault
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
? ? ? ? }
? ? })
}