This package is a work in process. Please DO NOT USE it yet

query-data-to-chart-private

    

Draw charts from Azure Data Explorer queries

Installation

npm install adx-query-charts

Dependencies

Make sure to install the following packages before using the adx-query-charts library:

1. moment: npm i moment
2. lodash: npm i lodash
3. highcharts: npm i highcharts

Usage

import * as Charts from 'adx-query-charts';

const highchartsVisualizer = new Charts.HighchartsVisualizer();
const chartHelper = chartHelper = new Charts.KustoChartHelper('chart-elem-id', highchartsVisualizer);
const chartOptions: Charts.IChartOptions = {
    chartType: Charts.ChartType.Column,
    columnsSelection: {
        xAxis: { name: 'timestamp', type: Charts.DraftColumnType.DateTime },
        yAxes: [{ name: 'requestCount', type: Charts.DraftColumnType.Int }]
    }
};

// Draw the chart - the chart will be drawn inside an element with 'chart-elem-id' id
chartHelper.draw(queryResultData, chartOptions);

API

IChartOptions

Option name:	Type:	Details:	Default value:
chartType	ChartType	Mandatory. The type of the chart to draw
columnsSelection	IColumnsSelection	The columns selection for the Axes and the split-by of the chart	If not provided, default columns will be selected. See: getDefaultSelection method
maxUniqueXValues	number	The maximum number of the unique X-axis values. The chart will show the biggest values, and the rest will be aggregated to a separate data point.	100
exceedMaxDataPointLabel	string	The label of the data point that contains the aggregated value of all the X-axis values that exceed the 'maxUniqueXValues'.	'OTHER'
aggregationType	AggregationType	Multiple rows with the same values for the X-axis and the split-by will be aggregated using a function of this type. For example, assume we get the following query result data: ['2016-08-02T10:00:00Z', 'Chrome 51.0', 15], ['2016-08-02T10:00:00Z', 'Internet Explorer 9.0', 4] When drawing a chart with columnsSelection = { xAxis: timestamp, yAxes: count_ }, and aggregationType = AggregationType.Sum we need to aggregate the values of the same timestamp value and return one row with ["2016-08-02T10:00:00Z", 19]	AggregationType.Sum
utcOffset	number	The desired offset from UTC in hours for date values. Used to handle timezone. The offset will be added to the original date from the query results data. For example: For 'Africa/Harare'timezone provide utcOffset = 2 and the displayed date will be be: '11/25/2019, 2:00 AM' instead of '11/25/2019, 12:00 AM' See time zone [info](https://msdn.microsoft.com/en-us/library/ms912391(v=winembedded.11)	0

ChartType

export enum ChartType {
    Line = 'Line',
    Scatter = 'Scatter',
    Area = 'Area',
    StackedArea = 'StackedArea',
    PercentageArea = 'PercentageArea',
    Column = 'Column',
    StackedColumn = 'StackedColumn',
    PercentageColumn = 'PercentageColumn',
    Pie = 'Pie',
    Donut = 'Donut',
}

IColumnsSelection

export interface IColumn {
    name: string;
    type: DraftColumnType;
}

export interface IColumnsSelection {
    xAxis: IColumn;
    yAxes: IColumn[];
    splitBy?: IColumn[];
}

AggregationType

export enum AggregationType {
    Sum = 'Sum',
    Average = 'Average',
    Min = 'Min',
    Max = 'Max'
}

Test

Unit tests are written using Jest.

Run tests: npm run test

Contributing

This project welcomes contributions and suggestions. Most contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. For details, visit https://cla.opensource.microsoft.com.

When you submit a pull request, a CLA bot will automatically determine whether you need to provide a CLA and decorate the PR appropriately (e.g., status check, comment). Simply follow the instructions provided by the bot. You will only need to do this once across all repos using our CLA.

This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact opencode@microsoft.com with any additional questions or comments.