剑道UI柱状图链接:http://jsfiddle.net/nayanakalkur/ZPUr4/119/
在小提琴的例子中,x轴在'0'。如何在Y轴上下移动坐标轴?假设我想让x轴的y值为10?如何做到这一点?
相同的代码:
HTML代码: <div id="example" class="k-content">
<div id="chart"></div>
</div>
Javascript代码:
function createChart() {
$("#chart").kendoChart({
title: {
text: "Site Visitors"
},
legend: {
position: "bottom"
},
seriesDefaults: {
type: "column",
labels: {
visible: true,
background: "transparent",
}
},
series: [{
name: "Total Visits",
data: series1,
gap: 1.0,
spacing: 0
}, {
name: "Unique visitors",
data: series2,
gap: 1.0
}],
valueAxis: {
line: {
visible: false
},
title: {
text: "Availability"
}
},
categoryAxis: {
majorGridLines: {
visible: true,
position: "bottom"
}
},
tooltip: {
visible: true,
format: "{0}"
}
});
}
var series1=[56000, 63000, 74000, 91000, 117000, 158000];
var series2= [-52000, 34000, 23000, -98000, 67000, 83000];
$(document).ready(function () {
createChart();
$("#example").bind("kendo:skinChange", createChart);
var chart = $("#chart").data("kendoChart"),
firstSeries = chart.options.series;
});
设置valueAxis.min
为10:
valueAxis: {
min: 10,
line: {
visible: false
},
title: {
text: "Availability"
}
},
您的JSFiddle在这里修改:http://jsfiddle.net/OnaBai/ZPUr4/120/
EDIT:如果您希望轴交叉在一个特定的值,那么将valueAxis.axisCrossingValue
设置为该值。
的例子:
valueAxis: {
axisCrossingValue: -50000,
line: { visible: false },
title: { text: "Availability" },
},
和JSFiddle修改http://jsfiddle.net/OnaBai/ZPUr4/126/