# 顏色（colors） 本節詳細說明了圖標中線條顏色、文字顏色等和顏色相關的內容。 ### 一、數據列顏色 Highcharts 中數據列的顏色是通過 `colors` 來指定的，colors 是個顏色值數組，默認是： ``` colors: ['#7cb5ec', '#434348', '#90ed7d', '#f7a35c', '#8085e9', '#f15c80', '#e4d354', '#8085e8', '#8d4653', '#91e8e1'] ``` 共有 10個默認顏色，你可以修改顏色值或增加顏色個數來自定義圖表數據列顏色。 數據列調用顏色的方式是第 n 個數據列使用第 n 個顏色數組里的值，當序列的數量超過顏色數組的長度，后續的序列將會從頭調用。  [在線試一試](http://code.hcharts.cn/hcharts.cn/hhhhqm) ### 二、柱形圖的顏色 柱形圖（包括柱狀圖、條形圖等）里一組柱形顏色是一樣的，很多人對此表示不理解  ``` series: [{ name: 'Tokyo', data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] }] ``` 通過代碼我們知道，一組柱形是屬于同一個數據列的，所以他們的顏色當然時一樣的。 你可能想到下面的這種方法： ``` series: [{ name: "Column series", data: [{ y:49.9, color:"#ff0000" }, // ... 省略代碼 ] }] ``` 這是在上一節“數據列”中說到的顏色賦值方式，用這種方法雖然可以實現想要的效果，但是如果分別對每個數據列賦值，顯然不合理。  highcharts 直接提供對柱形圖同數據列設置顏色，屬性是：[colorByPoint](http://www.hcharts.cn/api/index.php#plotOptions.column.colorByPoint) API 給出的說明是： ``` this option determines whether the chart should receive one color per series or one color per point. ``` 即 colorByPoint 決定了圖表是否給每個數據列或每個點分配一個顏色，默認值是 false， 即默認是給每個數據類分配顏色， 設置為 true 則是給每個點分配顏色。 設置 colorByPoint = true 后的效果見下圖：  [在線試一試](http://code.hcharts.cn/hcharts.cn/hhhhqz) #### 其他圖形可以用 colorByPoint 通過搜索 API 文檔可以知道其他圖表也可以用到 colorByPoint 這個屬性 * bar 條形圖 * column 柱狀圖 * columnrange 柱狀范圍圖 * heatmap 熱力圖 * treemap * waterfall 瀑布圖 * boxplot 箱線圖 注：API 文檔搜索功能很強大，請好好利用 ### 三、圖表中文字顏色 圖表中所有文字都設置字體、顏色等樣式，一般是通過 `style.color` 來設置文字顏色的，style 里可以用的屬性如下所示： ``` style: { color: '#ff0000', fontSize: "12px", fontWeight: "blod", fontFamily: "Courier new" } ``` 下面列舉圖表中常見文字的配置位置： 1. 標題樣式：title.style 及 subtitle.style 2. 坐標軸標簽樣式：xAxis.lables.style 及 yAxis.lables.style 3. 圖例文字樣式：legend.itemStyle 4. 數據提示框文字樣式：tooltip.style 5. .... 總之請自行在API文檔上搜索，圖表中任何文字都是可以精準控制的。 * * * （正文完，最后更新時間：2015-06-03 22:24:06）