Dynamic Series data is dotted

[antonborrazParticipant]

Hi Support!!!

I’ve a problem creating dynamic series and data on a linear graph. The main problem is that when I créate only one serie information is shown correctly,but when I define more, lines are converted into dots and I don’t know why.

Any Idea?

Here is my code. Thanks in advance.

 function InitializeGraphInfo(SelectedParameters, SelectedStations)
    {
        $("#idInformationNotSelected").hide();
        $("#chartContainer").hide();

        if (SelectedParameters != null && SelectedStations != null) {
            var arrGraphData = [];
            var arrDataFields = [];
            var arrCurrentData = [];

            var minValue = 0;
            var maxValue = 0;
            for (i = 0; i < SelectedStations.length; i++)
            {
                for (j = 0; j < SelectedParameters.length; j++)
                {
                    if (SelectedStations[i].level == 1)
                    {
                       arrGraphData.push({
                            dataField: SelectedStations[i].id + "-" + SelectedParameters[j].value.Id,
                            displayText: SelectedStations[i].label + " - " + SelectedParameters[j].value.Leyenda
                           /*,
                            lineDashStyle: '2,2', lineWidth: 4, dashStyle: 'visible'
                        */});

                       arrDataFields.push({
                           dataField: SelectedStations[i].id + "-" + SelectedParameters[j].value.Id
                       });
                        if (SelectedParameters[j].value.LimiteInf < minValue)
                        {
                            minValue = SelectedParameters[j].value.LimiteInf;
                        }

                        if (SelectedParameters[j].value.LimiteSup < maxValue) {
                            maxValue = SelectedParameters[j].value.LimiteSup;
                        }
                    }
                }
            }
            
            // prepare jqxChart settings
            var settings = {
                title: "Información de Parámetros en tiempo Real",
                description: "Información de Parámetros de Estaciones seleccionadas",
                enableAnimations: false,
                animationDuration: 1000,
                enableAxisTextAnimation: true,
                showLegend: true,
                padding: { left: 5, top: 5, right: 5, bottom: 5 },
                titlePadding: { left: 0, top: 0, right: 0, bottom: 10 },
                source: arrCurrentData,
                xAxis:
                {
                    dataField: 'timestamp',
                    type: 'date',
                    baseUnit: 'second',
                    unitInterval: 5,
                    formatFunction: function (value) {
                        return $.jqx.dataFormat.formatdate(value, "HH:mm:ss", 'es-es');
                    },
                    gridLines: { step: 2 },
                    valuesOnTicks: true,
                    labels: { angle: -45, offset: { x: -17, y: 0 } }
                },
                colorScheme: 'scheme06',
                seriesGroups:
                [
                    {
                        type: 'stackedspline',
                        columnsGapPercent: 50,
                        alignEndPointsWithIntervals: true,
                        valueAxis:
                        {
                            minValue: 0,
                            maxValue: 1000/*,
                            title: { text: 'Index Value' }*/
                        },
                        series: arrGraphData,
                    }

                ]
            };
            // create the chart
            $('#chartContainer').jqxChart(settings);

            $("#chartContainer").show();
            GetStationsData(arrGraphData, arrCurrentData);
            // auto update timer
            var ttimer = setInterval(GetStationsData, 5000, arrGraphData, arrCurrentData);
        }
        else
        {
            $("#idInformationNotSelected").show();
        }
    }

    function GetStationsData(arrGraphData, arrCurrentData)
    {
        var request = $.ajax({
            type: 'post',
            //data: arrGraphData,
            url: '@Url.Action("GetStationsData", "Home")?stations=' + JSON.stringify(arrGraphData),
        });

        request.done(function (info) {
            if (arrCurrentData.length >= 60) {
                arrCurrentData.splice(0, 1);
            }
            var timestamp = new Date();
            timestamp.setSeconds(timestamp.getSeconds());
            timestamp.setMilliseconds(0);

            for (i = 0; i < info.length; i++) {
                var obj = {};
                obj[info[i].dataField] = info[i].value;
                obj['timestamp'] = timestamp;
                arrCurrentData.push(obj);
            }
            $('#chartContainer').jqxChart('update');
        });
    }

[antonborrazParticipant]

Hi Guys!!!

I’ve solved the problem!!!

Data was bad introduced into arrCurrentData.

Kind Regards.

[Author]

Posts