目录
1、用js操作chart，
2、tooltip template鼠标悬浮显示内容，
3、双坐标轴，axisCrossingValues: [0, 30]，3指的是跨越横坐标轴标签项数，显示在右侧
4标签永远在下边，categoryaxis里多加个series-axis，valueAxes里加个 axisCrossingValue: [0, @int.MinValue]
5、更新数据
6、全部代码
7、图中只有一种柱，统一设置颜色，用.Column().Color("#5EB6E4")
@(Html.Kendo().Chart<ChartSeriesModel>()
.Name("equipmentChart") .Title(Resources.RegionEquipmentReportMachineTotal) .Legend(legend => legend.Visible(false)) .DataSource(ds => ds.Read(read => read.Action("GetEquipmentTotalData", "ReportManage"))) .SeriesDefaults(seriesDefaults => seriesDefaults .Column().Color("#5EB6E4") ) .Series(series => series.Column(model => model.Value,null, model => model.Category, null)) .Tooltip(tooltip => tooltip .Visible(true) .Format("{0}") )
1、用js操作chart，
2、tooltip template鼠标悬浮显示内容，
3、双坐标轴，axisCrossingValues: [0, 30]，3指的是跨越横坐标轴标签项数，显示在右侧
4标签永远在下边，categoryaxis里多加个series-axis，valueAxes里加个 axisCrossingValue: [0, @int.MinValue]
categoryAxis: [{
line: { visible: false},name: 'series-axis',axisCrossingValues: [0, 30]}, { line: { visible: false},categories: otherCategoryData,name: 'label-axis',axisCrossingValues: [0, 30]}],5、更新数据
$("#chartType").data("kendoChart").options.series[0].data = [
{ category: "500万元以下", value: firstLayerAmount, color: "#CCFFCC" }, { category: "500-1000万元", value: secondLayerAmount, color: "#99CCCC" }, { category: "1000-2000万元", value: thirdLayerAmount, color: "#9999CC" }, { category: "2000-5000万元", value: fourthLayerAmount, color: "#CC99CC" } ]; $("#chartType").data("kendoChart").refresh();6、全部代码
$("#otherChart").kendoChart({
title: { text: verticleCompareField + "利润总额其他方面分布图" }, legend: { position: "top" }, tooltip: { visible: true, template: '#= series.name #: #= value #' }, series: [ { name: "利润总额", type: "column", data: otherAmountData, axis: "amount" }, { name: "企业数量", type: "column", data: otherCountData, axis: "companyCount" } ], valueAxes: [ { title: { text: "万元" }, name: "amount", color: "#ff6800", axisCrossingValue: [0, @int.MinValue] }, { name: "companyCount", title: { text: "家" }, color: "#a0a700", axisCrossingValue: [0, @int.MinValue] } ], categoryAxis: [{ line: { visible: false }, name: 'series-axis', axisCrossingValues: [0, 30] }, { line: { visible: false }, categories: otherCategoryData, name: 'label-axis', axisCrossingValues: [0, 30] } ], pannable: { lock: "y" }, zoomable: { mousewheel: { lock: "y" }, selection: { lock: "y" } } }); } };