generateDataRows

Prepares the DataRows for the ChartWizard component based on the provided data and columns.

Example

Open In Dojo
<div id="grid"></div>
<button id="get">generateDataRows</button>
<div id="chartwizard"></div>
<script>
    $("#grid").kendoGrid({
            dataSource: {
                data: [
                  {
                    ID: '1',
                    Product: 'Calzone',
                    Quantity: 1,
                    Price: 12.39,

                  }, {
                    ID: '2',
                    Product: 'Margarita',
                    Quantity: 2,
                    Price: 8.79,
                  }, {
                    ID: '3',
                    Product: 'Formaggio',
                    Quantity: 1,
                    Price: 13.99,
                    Tax: 2.8,
                    Total: 16.79
                  }, {
                    ID: '4',
                    Product: 'Greek Salad',
                    Quantity: 1,
                    Price: 9.49,
                  }, {
                    ID: '5',
                    Product: 'Blue Cheese',
                    Quantity: 3,
                    Price: 11.49,
                  }
                ],

                schema: {
                    model: {
                        id: "ID"
                    }
                }
            },
            selectable: {
              mode: "multiple, cell",
            },
            scrollable: true,
            columns: [
                {
                    field: "Product",
                    title: "Product",
                    width: 300
                },
                {
                    field: "Quantity",
                    width: 300,
                    title: "Quantity"
                },
                {
                    field: "Price",
                    title: "Price",
                }
            ]
        });


        $("#chartwizard").kendoChartWizard({
            window: {
              visible: false
            }
        });

        $("#get").kendoButton({
            click: () => {
              const grid = $("#grid").data("kendoGrid");
              const data = grid.getSelectedData();
              const columns = grid.columns;

              const wizardData = kendo.ui.ChartWizard.generateDataRows(data, columns);

              const chartWizard = $("#chartwizard").data("kendoChartWizard");
              chartWizard.setDataSource(wizardData);
              chartWizard.open();
            }
        });
</script>

Parameters

columns Array

The columns containing the data fields.

data Array

The dataItems.

In this article