or
var chartData = [
{ X: 0, serie1: 12, serie2: 16, serie3: 11 },
{ X: 0, serie1: 32, serie2: 12, serie3: 15 },
{ X: 1, serie1: 15, serie2: 18, serie3: 9 },
{ X: 1, serie1: 8, serie2: 13, serie3: 17 }
];
$('#chartContainer').kendoChart({
dataSource: {
data: chartData
},
theme: 'default',
legend: {
position: 'bottom'
},
seriesDefaults: {
type: 'column',
stack: true
},
series:
[
{ field: 'serie1', name: 'serie1' },
{ field: 'serie2', name: 'serie2' },
{ field: 'serie3', name: 'serie3' }
],
categoryAxis: {
field: 'X'
},
tooltip: {
visible: true
}
});
But I end up with a graph where categories are repeated on the x axis. Is there a way I could have them grouped? Something that would look like this:
http://peltiertech.com/Utility/pix/clusterstackchart.png
Thank you!
<div data-role="view" id="dashView" data-layout="mobile-view"> <div data-role="view" id="dataA"> <a data-role="button" href="#dataB">A</a> </div> <div data-role="view" id="dataB"> <a data-role="button" href="#dataC">B</a> </div> <div data-role="view" id="dataC"> <a data-role="button" href="#dataA">C</a> </div></div><script type="text/x-kendo-template" id="someTemplate"> <div> <label> ${firstName}</label> <label>${lastName}</label> </div></script><div data-role="grid" data-bind="source: people" data-columns='[ {"field": "firstName", "title": "Full Name", "template": "kendo.template($("#someTemplate"))" }]'></div>@(Html.Kendo().Grid((IEnumerable<MyModel>)ViewBag.Model) .Name("Grid") .Columns(columns => { .. removed for brevity .. columns.Command(command => { command.Edit(); command.Destroy(); }); }) .ToolBar(toolbar => toolbar.Create()) .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("EditorTemplate")) .Pageable() .Sortable() .Scrollable() .DataSource(dataSource => dataSource .Ajax() .PageSize(20) .Events(events => events.Error("error_handler")) .Model(model => model.Id(m => m.recordID)) .Create(update => update.Action("Create", "Controller")) .Update(update => update.Action("Update", "Controller")) .Destroy(update => update.Action("Destroy", "Controller")) ) )@(Html.Kendo().DropDownListFor(m => m.StateId) .Name("StateId") .DataTextField("StateName") .DataValueField("StateId") .DataSource(source => { source.Read(read => { read.Action("GetStatesList", "Controller"); }) .ServerFiltering(true); }) .SelectedIndex(0) .OptionLabel("Select a State") )public JsonResult GetStatesList(){ var states = client.GetStates(); return Json(states, JsonRequestBehavior.AllowGet);}