Introduction
AI Components & Features
Contribution
Knowledge Base
StockChart

The aggregate function to apply for date series.

This function is used when a category (an year, month, etc.) contains two or more points. The function return value is displayed instead of the individual points.

The supported values are:

  • "avg" - the average of all values for the date period.
  • "count" - the number of values for the date period.
  • "max" - the highest value for the date period.
  • "min" - the lowest value for the date period.
  • "sum" - the sum of all values for the date period. Defaults to 0 if no data points are defined.
  • "sumOrNull" - the sum of all values for the date period. Defaults to null if no data points are defined.
  • "first" - the first value
  • function(values, series, dataItems, category) - user-defined aggregate function. Returns single value or data item.
  • object - (compound aggregate) Applicable to "candlestick" and ohlc "series". Specifies the aggregate for each data item field.
pseudo
    aggregate: {
        open: "max",
        high: "max",
        close: "min",
        low: "max"
    }

Example 

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
      series: [
        {
          type: "candlestick",
          data: [
            {
              date: new Date(2024, 0, 1),
              open: 150.25,
              high: 152.8,
              low: 149.5,
              close: 152.3,
            },
            {
              date: new Date(2024, 0, 2),
              open: 152.5,
              high: 154.2,
              low: 151.8,
              close: 153.75,
            },
            {
              date: new Date(2024, 0, 3),
              open: 153.8,
              high: 155.4,
              low: 152.9,
              close: 154.2,
            },
            
          ],
          openField: "open",
          highField: "high",
          lowField: "low",
          closeField: "close",
          dateField: "date",
          name: "Stock Price",
          color: "#03a9f4",
          downColor: "#f44336",
        },
      ],
      navigator: {
        series: {
          type: "line",
          aggregate: "avg",
          data: [
            {
              date: new Date(2024, 0, 1),
              open: 150.25,
              high: 152.8,
              low: 149.5,
              close: 152.3,
            },
            {
              date: new Date(2024, 0, 2),
              open: 152.5,
              high: 154.2,
              low: 151.8,
              close: 153.75,
            },
            {
              date: new Date(2024, 0, 3),
              open: 153.8,
              high: 155.4,
              low: 152.9,
              close: 154.2,
            },
            
          ],
          field: "close",
          dateField: "date",
          color: "#ff9800",
        },
      },
    });
</script>
In this article
navigator.series.aggregate
Not finding the help you need?
Contact Support