# 線性軸
線性刻度用於繪製數值資料。它可以放置在 x 軸或 y 軸上。散佈圖表類型會自動配置折線圖,以將其中一個刻度用於 x 軸。顧名思義,線性內插用於確定值在軸上的位置。
# 配置選項
# 線性軸特定選項
命名空間: options.scales[scaleId]
名稱 | 類型 | 描述 |
---|---|---|
beginAtZero | 布林值 | 如果為 true,則刻度將包含 0(如果尚未包含)。 |
grace | 數字 |字串 | 在資料範圍之上和之下增加的空間的百分比(以 % 結尾的字串)或數量(數字)。更多... |
# 所有笛卡爾軸的通用選項
命名空間: options.scales[scaleId]
名稱 | 類型 | 預設值 | 描述 |
---|---|---|---|
bounds | 字串 | 'ticks' | 決定刻度邊界。更多... |
clip | 布林值 | true | 如果為 true,則將資料集繪圖剪裁到刻度的大小,而不是圖表區域 |
position | 字串 | 物件 | 軸的位置。更多... | |
stack | 字串 | 堆疊群組。相同 position 且具有相同 stack 的軸會堆疊在一起。 | |
stackWeight | 數字 | 1 | 刻度在堆疊群組中的權重。用於決定群組內刻度所分配的空間量。 |
axis | 字串 | 這是哪種類型的軸。可能的值為:'x' 、'y' 。如果未設定,則會從 ID 的第一個字元推斷,該字元應為 'x' 或 'y' 。 | |
offset | 布林值 | false | 如果為 true,則會在兩個邊緣新增額外空間,並縮放軸以適合圖表區域。預設情況下,這會針對長條圖設定為 true 。 |
title | 物件 | 刻度標題配置。更多... |
# 所有軸的通用選項
命名空間: options.scales[scaleId]
名稱 | 類型 | 預設值 | 描述 |
---|---|---|---|
type | 字串 | 正在使用的刻度類型。可以使用字串索引鍵建立和註冊自訂刻度。這允許變更圖表軸的類型。 | |
alignToPixels | 布林值 | false | 將像素值對齊至裝置像素。 |
backgroundColor | 顏色 | 刻度區域的背景顏色。 | |
border | 物件 | 邊框配置。更多... | |
display | 布林值 |字串 | true | 控制軸的整體可見性(當 true 時可見,當 false 時隱藏)。當 display: 'auto' 時,只有當至少一個相關聯的資料集可見時,軸才會可見。 |
grid | 物件 | 格線配置。更多... | |
min | 數字 | 使用者定義的刻度最小值,覆寫來自資料的最小值。更多... | |
max | 數字 | 使用者定義的刻度最大值,覆寫來自資料的最大值。更多... | |
reverse | 布林值 | false | 反轉刻度。 |
stacked | 布林值 |字串 | false | 是否應該堆疊資料。更多... |
suggestedMax | 數字 | 計算最大資料值時使用的調整。更多... | |
suggestedMin | 數字 | 計算最小資料值時使用的調整。更多... | |
ticks | 物件 | 刻度配置。更多... | |
weight | 數字 | 0 | 用於排序軸的權重。較高的權重會離圖表區域較遠。 |
# 刻度配置
# 線性軸特定刻度選項
命名空間:options.scales[scaleId].ticks
名稱 | 類型 | 可腳本化 | 預設值 | 描述 |
---|---|---|---|---|
count | 數字 | 是 | 未定義 | 要產生的刻度數。如果指定,則這會覆寫自動產生。 |
format | 物件 | 是 | 預設標籤格式器使用的 Intl.NumberFormat (在新視窗開啟) 選項 | |
precision | 數字 | 是 | 如果已定義且未指定 stepSize ,則步長將四捨五入到這麼多小數位數。 | |
stepSize | 數字 | 是 | 使用者定義的刻度固定步長。更多... |
# 所有笛卡爾軸的通用刻度選項
命名空間:options.scales[scaleId].ticks
名稱 | 類型 | 預設值 | 描述 |
---|---|---|---|
align | 字串 | 'center' | 刻度沿軸的對齊方式。可以是 'start' 、'center' 、'end' 或 'inner' 。inner 對齊表示水平軸的第一個刻度對齊 start ,最後一個刻度對齊 end |
crossAlign | 字串 | 'near' | 垂直於軸的刻度對齊方式。可以是 'near' 、'center' 或 'far' 。請參閱 刻度對齊 |
sampleSize | 數字 | ticks.length | 在決定可容納多少標籤時要檢查的刻度數。設定較小的值會更快,但在標籤長度差異很大時可能較不準確。 |
autoSkip | 布林值 | true | 如果為 true,則會自動計算可以顯示多少標籤,並相應地隱藏標籤。標籤將旋轉到 maxRotation ,然後再跳過任何標籤。關閉 autoSkip 以顯示所有標籤,無論如何。 |
autoSkipPadding | 數字 | 3 | 啟用 autoSkip 時,水平軸上刻度之間的間距。 |
includeBounds | 布林值 | true | 是否應該將已定義的 min 和 max 值呈現為刻度,即使它們不是「適當的」。 |
labelOffset | 數字 | 0 | 從刻度的中心點偏移標籤的像素距離(對於 x 軸,為 x 方向;對於 y 軸,為 y 方向)。注意:這可能會導致邊緣的標籤被畫布的邊緣裁剪 |
maxRotation | 數字 | 50 | 旋轉以壓縮標籤時,刻度標籤的最大旋轉角度。注意:旋轉直到必要時才會發生。注意:僅適用於水平刻度。 |
minRotation | 數字 | 0 | 刻度標籤的最小旋轉角度。注意:僅適用於水平刻度。 |
mirror | 布林值 | false | 將刻度標籤繞軸翻轉,在圖表內顯示標籤,而不是在外部顯示。注意:僅適用於垂直刻度。 |
padding | 數字 | 0 | 刻度標籤與軸之間的間距。在垂直軸上設定時,這會應用於水平 (X) 方向。在水平軸上設定時,這會應用於垂直 (Y) 方向。 |
maxTicksLimit | 數字 | 11 | 要顯示的最大刻度和格線數。 |
# 所有軸的通用刻度選項
命名空間:options.scales[scaleId].ticks
名稱 | 類型 | 可腳本化 | 預設值 | 描述 |
---|---|---|---|---|
backdropColor | 顏色 | 是 | 'rgba(255, 255, 255, 0.75)' | 標籤背景的顏色。 |
backdropPadding | 間距 | 2 | 標籤背景的間距。 | |
callback | 函式 | 傳回刻度值的字串表示法,因為它應該顯示在圖表上。請參閱 callback。 | ||
display | 布林值 | true | 如果為 true,則顯示刻度標籤。 | |
color | 顏色 | 是 | Chart.defaults.color | 刻度的顏色。 |
font | 字型 | 是 | Chart.defaults.font | 請參閱 字型 |
major | 物件 | {} | 主要刻度配置. | |
padding | 數字 | 3 | 設定刻度標籤與軸的偏移量 | |
showLabelBackdrop | 布林值 | 是 | 徑向刻度為 true ,否則為 false | 如果為 true,則在刻度標籤後面繪製背景。 |
textStrokeColor | 顏色 | 是 | `` | 文字周圍筆觸的顏色。 |
textStrokeWidth | 數字 | 是 | 0 | 文字周圍的筆觸寬度。 |
z | 數字 | 0 | 刻度圖層的 z-index。當刻度繪製在圖表區域上時很有用。值 <= 0 繪製在資料集下方,> 0 繪製在上方。 |
# 步階大小
若設定此項,刻度標記將會以 stepSize
的倍數來列舉,每個增量產生一個刻度。若未設定,則會使用友善數字演算法自動標記刻度。
此範例設定了一個圖表,其 y 軸會以 0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 4.5, 5
的刻度建立標記。
let options = {
scales: {
y: {
max: 5,
min: 0,
ticks: {
stepSize: 0.5
}
}
}
};
# 緩衝
若數值為以 %
結尾的字串,則會被視為百分比。若為數字,則會被視為數值。該數值會加到資料的最大值,並從資料的最小值中減去。這會擴展刻度範圍,如同資料值增加了這麼多一樣。
# 內部資料格式
在內部,線性刻度使用數值資料。