# 線性徑向軸
線性徑向刻度用於繪製數值資料。顧名思義,線性插值用於確定數值相對於軸線中心的所在位置。
徑向線性刻度提供了以下額外的設定選項。
# 設定選項
# 線性徑向軸特定選項
命名空間:options.scales[scaleId]
名稱 | 類型 | 預設值 | 描述 |
---|---|---|---|
animate | boolean | true | 是否從中心動畫縮放圖表 |
angleLines | object | 角度線設定。更多... | |
beginAtZero | boolean | false | 如果為 true,則刻度將包含 0(如果尚未包含)。 |
pointLabels | object | 點標籤設定。更多... | |
startAngle | number | 0 | 刻度的起始角度。以度為單位,0 度在頂部。 |
# 所有軸線的通用選項
命名空間:options.scales[scaleId]
名稱 | 類型 | 預設值 | 描述 |
---|---|---|---|
type | string | 所使用的刻度類型。可以使用字串鍵建立和註冊自訂刻度。這允許變更圖表的軸線類型。 | |
alignToPixels | boolean | false | 將像素值對齊至裝置像素。 |
backgroundColor | 顏色 | 刻度區域的背景顏色。 | |
display | boolean |string | true | 控制軸線的整體可見性(true 時可見,false 時隱藏)。當 display: 'auto' 時,只有當至少一個相關的資料集可見時,軸線才可見。 |
grid | object | 網格線設定。更多... | |
min | number | 使用者定義的刻度最小值,覆寫資料的最小值。更多... | |
max | number | 使用者定義的刻度最大值,覆寫資料的最大值。更多... | |
reverse | boolean | false | 反轉刻度。 |
stacked | boolean |string | false | 是否堆疊資料。更多... |
suggestedMax | number | 計算最大資料值時使用的調整。更多... | |
suggestedMin | number | 計算最小資料值時使用的調整。更多... | |
ticks | object | 刻度設定。更多... | |
weight | number | 0 | 用於排序軸線的權重。較高的權重離圖表區域較遠。 |
# 刻度設定
# 線性徑向軸特定刻度選項
命名空間:options.scales[scaleId].ticks
名稱 | 類型 | 可腳本化 | 預設值 | 描述 |
---|---|---|---|---|
count | number | 是 | undefined | 要產生的刻度數。如果指定,這將覆寫自動產生。 |
format | object | 是 | 預設標籤格式器使用的 Intl.NumberFormat (開啟新視窗) 選項 | |
maxTicksLimit | number | 是 | 11 | 要顯示的最大刻度和網格線數。 |
precision | number | 是 | 如果定義且未指定 stepSize ,則步長大小將四捨五入到這麼多小數位數。 | |
stepSize | number | 是 | 使用者定義的刻度固定步長。更多... |
# 所有軸線的通用刻度選項
命名空間:options.scales[scaleId].ticks
名稱 | 類型 | 可腳本化 | 預設值 | 描述 |
---|---|---|---|---|
backdropColor | 顏色 | 是 | 'rgba(255, 255, 255, 0.75)' | 標籤背景的顏色。 |
backdropPadding | 邊距 | 2 | 標籤背景的邊距。 | |
callback | function | 傳回刻度值的字串表示,因為它應該顯示在圖表上。請參閱回呼。 | ||
display | boolean | true | 如果為 true,則顯示刻度標籤。 | |
color | 顏色 | 是 | Chart.defaults.color | 刻度的顏色。 |
font | 字型 | 是 | Chart.defaults.font | 請參閱字型 |
major | object | {} | 主要刻度設定. | |
padding | number | 3 | 設定刻度標籤與軸線的偏移量 | |
showLabelBackdrop | boolean | 是 | 徑向刻度為 true ,否則為 false | 如果為 true,則在刻度標籤後面繪製背景。 |
textStrokeColor | 顏色 | 是 | `` | 文字周圍筆觸的顏色。 |
textStrokeWidth | number | 是 | 0 | 文字周圍筆觸的寬度。 |
z | number | 0 | 刻度圖層的 z-index。當刻度繪製在圖表區域上時很有用。值 <= 0 繪製在資料集下方,> 0 繪製在上方。 |
可腳本化的內容在選項章節中描述。
# 網格線設定
命名空間:options.scales[scaleId].grid
,它定義軸線網格線的選項。
名稱 | 類型 | 可腳本化 | 可索引 | 預設值 | 描述 |
---|---|---|---|---|---|
borderDash | number[] | [] | 網格線上虛線的長度和間距。請參閱MDN (開啟新視窗)。 | ||
borderDashOffset | number | 是 | 0.0 | 線條虛線的偏移量。請參閱MDN (開啟新視窗)。 | |
circular | boolean | false | 如果為 true,則網格線為圓形(僅在雷達圖和極地區域圖上)。 | ||
color | 顏色 | 是 | 是 | Chart.defaults.borderColor | 網格線的顏色。如果指定為陣列,則第一個顏色適用於第一個網格線,第二個顏色適用於第二個網格線,依此類推。 |
display | boolean | true | 如果為 false,則不顯示此軸線的網格線。 | ||
lineWidth | number | 是 | 是 | 1 | 網格線的筆觸寬度。 |
可腳本化的內容在選項章節中描述。
# 軸線範圍設定
鑑於軸線範圍設定的數量,了解它們之間的相互作用非常重要。
suggestedMax
和 suggestedMin
設定只變更用於縮放軸線的資料值。這些對於在維持自動調整行為的同時延伸軸線的範圍很有用。
let minDataValue = Math.min(mostNegativeValue, options.ticks.suggestedMin);
let maxDataValue = Math.max(mostPositiveValue, options.ticks.suggestedMax);
在此範例中,最大的正數值為 50,但資料最大值延伸至 100。但是,由於最低資料值低於 suggestedMin
設定,因此會被忽略。
let chart = new Chart(ctx, {
type: 'radar',
data: {
datasets: [{
label: 'First dataset',
data: [0, 20, 40, 50]
}],
labels: ['January', 'February', 'March', 'April']
},
options: {
scales: {
r: {
suggestedMin: 50,
suggestedMax: 100
}
}
}
});
與 suggested*
設定相反,min
和 max
設定為軸線設定明確的終點。當設定這些設定時,某些資料點可能不可見。
# 步長大小
如果設定,刻度刻度將以 stepSize
的倍數列舉,每個增量有一個刻度。如果未設定,則刻度會使用漂亮數字演算法自動標記。
此範例設定一個 y 軸圖表,該圖表在 0、0.5、1、1.5、2、2.5、3、3.5、4、4.5、5
處建立刻度。
let options = {
scales: {
r: {
max: 5,
min: 0,
ticks: {
stepSize: 0.5
}
}
}
};
# 角度線選項
以下選項用於設定從圖表中心輻射到點標籤的角度線。命名空間:options.scales[scaleId].angleLines
名稱 | 類型 | 可腳本化 | 預設值 | 描述 |
---|---|---|---|---|
display | boolean | true | 如果為 true,則顯示角度線。 | |
color | 顏色 | 是 | Chart.defaults.borderColor | 角度線的顏色。 |
lineWidth | number | 是 | 1 | 角度線的寬度。 |
borderDash | number[] | 是1 | [] | 角度線上虛線的長度和間距。請參閱MDN (開啟新視窗)。 |
borderDashOffset | number | 是 | 0.0 | 線條虛線的偏移量。請參閱MDN (開啟新視窗)。 |
borderDash
設定僅接受靜態值或函式。不支援傳遞陣列的陣列。
可腳本化的內容在選項章節中描述。
# 點標籤選項
以下選項用於配置顯示在刻度周邊的點標籤。命名空間:options.scales[scaleId].pointLabels
名稱 | 類型 | 可腳本化 | 預設值 | 描述 |
---|---|---|---|---|
backdropColor | 顏色 | true | undefined | 點標籤的背景顏色。 |
backdropPadding | 邊距 | 2 | 標籤背景的邊距。 | |
borderRadius | number |object | true | 0 | 點標籤的邊框圓角。 |
display | boolean |string | true | 如果為 true,則顯示點標籤。當 display: 'auto' 時,如果標籤與另一個標籤重疊,則會隱藏該標籤。 | |
callback | function | 將資料標籤轉換為點標籤的回調函式。預設實作僅返回目前的字串。 | ||
color | 顏色 | 是 | Chart.defaults.color | 標籤的顏色。 |
font | 字型 | 是 | Chart.defaults.font | 請參閱字型 |
padding | number | 是 | 5 | 圖表和點標籤之間的間距。 |
centerPointLabels | boolean | false | 如果為 true,則點標籤會置中。 |
可腳本化的內容在選項章節中描述。
# 內部資料格式
在內部,線性徑向刻度使用數值資料