博客 / 詳情

返回

highchart的(column)柱狀圖修改圖例

(highchart的(column)柱狀圖修改圖例)

情況説明

柱狀圖的圖例默認是圓點的,如圖
在這裏插入圖片描述
要修改成方形,可以採用如下形式

plotOptions: {
    column: {
        tooltip: {
            pointFormat: `<span style="color:{point.color}">\u25A0</span>  {series.name}:{point.y}<br/>`
        }
    }
}

效果

在這裏插入圖片描述

解釋

採用格式化字符串的形式去替換,其中的\u25A0(Unicode字體)代表的是”實心方形“,然後再用point.color設置顏色即可達到目的,其他的形狀同理。

相關鏈接

獲取Unicode字體的鏈接 : https://unicode-table.com/cn/search/?q=%E5%AE%9E%E5%BF%83%E6%96%B9%E5%9D%97.

user avatar laughingzhu 頭像 lantianhaijiao 頭像 lanlanjintianhenhappy 頭像 dujing_5b7edb9db0b1c 頭像 susouth 頭像 columsys 頭像 201926 頭像 huanjinliu 頭像 musicfe 頭像 wukongnotnull 頭像 nihaojob 頭像 sunshine_591c4563d4a83 頭像
27 位用戶收藏了這個故事!

發佈 評論

Some HTML is okay.