How to show average Line chart of multiple datapoints?

[ganeshvarahade]

I have line chart which contains multiple data-points-xid.
Here 3 data points have 3 values.
So,I want to show average of these data-points(pointxid1, pointxid2, pointxid2) with values(value1,value2,value3) in one chart.
Please Help me in this

<md-card-content>
            Title
            <br/>
            <ma-point-values point-xid=“pointxid1” values="value1" from="from" to="to" rollup="AVERAGE" auto-rollup-interval="true"></ma-point-values>
            <ma-point-values point-xid="pointxid2” values="value2” from="from" to="to" rollup="AVERAGE" auto-rollup-interval="true"></ma-point-values>
            <ma-point-values point-xid="pointxid3” values=“value3” from="from" to="to" rollup="AVERAGE" auto-rollup-interval="true"></ma-point-values>
            <ma-serial-chart options="{theme:'black'}" style="height: 200px; width: 100%" series-1-values="value1" series-1-title=“title1” series-1-type="line" series-1-color="#ff0000" series-2-values="value2” series-2-title=“title2” series-2-type="line" series-2-color="#00ff00" series-3-values="value3” series-3-title=“title3” series-3-type="line" series-3-color="#0000ff" legend="true" balloon="true"></ma-serial-chart>
        </md-card-content>

[Jared Wiltshire]

I'm not following. Do you want an average of all 3 points combined or the average of each point individually? Do you want a running average calculated every x seconds or a single average for the whole time period?

[phildunlap]

Hi ganeshvarahade,

I think you may want to reconsider your choice in text editor. It looks like it's doing some undesirable auto-formatting for you.

[ganeshvarahade]

@jared-wiltshire

Yes,I want an average of all 3 points combined with running average calculated every x seconds.

[Jared Wiltshire]

@ganeshvarahade

You will have to write your own component/controller for this. We don't currently have anything which will do this for you. See here for help adding your own component/controllers etc -
https://help.infiniteautomation.com/getting-started-with-a-user-module/

I would suggest creating a component which just takes an array of arrays and combines them into one averaged array. e.g.

userModule.component('averageArrays', {
    bindings: {
        input: '<',
        output: '='
    },
    controller: function() {
        this.$onChanges = function() {
            if (angular.isArray(this.input) && angular.isArray(this.input[0])) {
                const numArrays = this.input.length;
                const valueLength = this.input[0].length;
                this.output = [];
                
                for (let i = 0; i < valueLength; i++) {
                    const timestamp = this.input[0]*.timestamp;
                    let accum = 0;
                    
                    for (let j = 0; j < numArrays; j++) {
                        accum += this.input[j]*.value;
                    }

                    this.output.push({
                        timestamp: timestamp,
                        value: accum / numArrays
                    });
                }
            }
        }
    }
});

Use it like this

<average-arrays input="[values1, values2, values3]" output="averageArray" ></average-arrays>

[ganeshvarahade]

Thank you so much @Jared-Wiltshire