Databases
StackOverflow2013
Postsdbo
POKendo UI BarChart Data Grouping
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POKendo UI BarChart Data Grouping
    primarykey
    data
    text
    <p>Not sure if this is possible. In my example I am using json as the source but this could be any size. In my example on <a href="http://jsfiddle.net/jqIndy/ZPUr4/3/" rel="nofollow">fiddle</a> I would use this data in a shared fashion by only binding two columns ProductFamily (xAxis) and Value (yAxis) but I would like to be able to group the columns by using an aggregate.</p> <p>In this example without the grouping it shows multiple columns for FamilyA. <strong>Can this be grouped into ONE column and the values aggregated regardless of the amount of data?</strong></p> <p>So the result will show one column for FamilyA of Value 4850 + 4860 = 9710 etc.?</p> <p>A problem with all examples online is that there is always the correct amount of data for each category. Not sure if this makes sense?</p> <p><a href="http://jsfiddle.net/jqIndy/ZPUr4/3/" rel="nofollow">http://jsfiddle.net/jqIndy/ZPUr4/3/</a></p> <pre><code>//Sample data (see fiddle for complete sample) [{ "Client":"", "Date":"2011-06-01", "ProductNumber":"5K190", "ProductName":"CABLE USB", "ProductFamily":"FamilyC", "Status":"OPEN", "Units":5000, "Value":5150.0, "ShippedToDestination":"CHINA" }] var productDataSource = new kendo.data.DataSource({ data: dr, //group: { // field: "ProductFamily", //}, sort: { field: "ProductFamily", dir: "asc" }, //aggregate: [ // { field: "Value", aggregate: "sum" } //], //schema: { // model: { // fields: { // ProductFamily: { type: "string" }, // Value: { type: "number" }, // } // } //} }) $("#product-family-chart").kendoChart({ dataSource: productDataSource, //autoBind: false, title: { text: "Product Family (past 12 months)" }, seriesDefaults: { overlay: { gradient: "none" }, markers: { visible: false }, majorTickSize: 0, opacity: .8 }, series: [{ type: "column", field: "Value" }], valueAxis: { line: { visible: false }, labels: { format: "${0}", skip: 2, step: 2, color: "#727f8e" } }, categoryAxis: { field: "ProductFamily" }, legend: { visible: false }, tooltip: { visible: true, format: "Value: ${0:N0}" } });​ </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USTJ.
    1. USjqIndy
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POKendo UI BarChart Data Grouping
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POKendo UI BarChart Data Grouping
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POKendo UI BarChart Data Grouping
      1. This table or related slice is empty.
      1. VTUpMod
    1. COI am trying to create a dashboard which will contain quite a few graphs and in order to give this ultimate responsiveness I thought it best to create ONE big json file containing all data but it seems this approach is not possible. This file can then be shared between all graphs but because the structure of each graph is so different I'll have to create one json file for each graph.
      singulars
      1. POKendo UI BarChart Data Grouping
      1. USjqIndy
    2. COThis may help you http://jsfiddle.net/v8tsQ/42/
      singulars
      1. POKendo UI BarChart Data Grouping
      1. USSimonGates
    3. COThe problem with this one is if you had another item in the json for the same company for the same quarter this will display as an additional column on the bar chart. How can I add this total to the existing 2011Q2 so that it still displays only 1 col with total of 1 + 145 = 146? { "CompanyId": 201, "GroupName": "Constellation", "SectionName": "CCLF", "FindingQuarter": "2011Q2", "DataElement": "Total", "DataValue": "", "Total": 145 },
      singulars
      1. POKendo UI BarChart Data Grouping
      1. USjqIndy
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload