DevExtreme Charts控件附帶了對軸定位邏輯的增強，開發人員可以在圖表上的任何位置（不僅僅是它的邊緣）定位軸并指定交點坐標。例如，此功能允許開發人員在滾動和縮放操作期間在固定位置創建象限圖或顯示軸。

DevExtreme v22.1正式版下載

自定義交點

通常，使用‘position’ 屬性來指定必須渲染軸的邊緣（默認情況下是左邊緣和下邊緣）。 在這種情況下，軸在可見范圍角處相交，可見范圍取決于數據點和滾動/縮放坐標。

在某些情況下，您可能希望將軸固定到其正交軸上的特定值。 要實現此要求，您可以使用“argumentAxis”和“valueAxis”配置對象的新屬性。 在下面的示例中，軸固定在彼此的 0 點。

argumentAxis: {
customPosition: 0 // value at valueAxis
},
valueAxis: {
customPosition: 0 // value at argumentAxis
}

軸偏移

對于某些使用場景，您可能需要在獨立于當前縮放級別和滾動位置的固定位置顯示軸，可以使用新的 選項來指定相對于其原始交點的軸坐標（以像素為單位）。在下面的示例中，軸始終在圖表可見范圍的中心相交：

argumentAxis: {
offset: -200 // a half of visible range height
},
valueAxis: {
offset: 390 // a half of visible range width
}

支持多軸

如果您的圖表包含多個數值軸，可以使用選項設置相關數值軸的名稱，可以按如下方式使用它：

argumentAxis: {
customPosition: -10,
customPositionAxis: "leftAxis"
},
valueAxis: [{
position: "right"
},{
position: "left",
name: "leftAxis"
}]

DevExtreme | 下載試用

DevExtreme擁有高性能的HTML5 / JavaScript小部件集合，使您可以利用現代Web開發堆棧（包括React，Angular，ASP.NET Core，jQuery，Knockout等）構建交互式的Web應用程序。從Angular和Reac，到ASP.NET Core或Vue，DevExtreme包含全面的高性能和響應式UI小部件集合，可在傳統Web和下一代移動應用程序中使用。 該套件附帶功能齊全的數據網格、交互式圖表小部件、數據編輯器等。

DevExpress技術交流群6：600715373      歡迎一起進群討論