time axis values not shown in timeseries_line chart

[Former Member]

Hi all,

I am implementing a timeseries_line chart and I am able to get the measures and also date (I see them in the debugger) and the chart is also shown with the correct data.

However the dates are not shown in the time axis. I would appreciate any help.

Here a screenshot: time-axis.png

UPDATE: I noticed that the correct time axis value is shown for only one data point. If I have more data it does not show anything again (see screenshot above).

Here my XML file :

XML:

<viz:VizFrame id="vizFrame"
              height="700px"
              vizType="timeseries_line"
              width="100%"
              uiConfig="{applicationSet:'fiori'}"
              vizProperties="{
                plotArea:{
                    dataLabel:{
                        formatString: '__UI5__ShortIntegerMaxFraction2', visible: false
                    }
                },
                valueAxis:{
                    title:{
                        visible: true
                    }
                },
                timeAxis:{
                    title:{
                        visible: true
                    },
                    levels:[ 'month', 'day', 'year' ],
                    levelConfig:{
                        month: {formatString: 'MM' },
                        year: { formatString: 'yyyy' }
                    },
                    interval:{
                        unit: ''}
                    }
              }">
</viz:VizFrame>

and here the javascript method to show the chart:

showChart: function () {
    this.vizFrame.removeAllFeeds();
    const deviceProperties = this.viewModel.getProperty('/selectedDeviceProperties');
    const selectedSensorId = this.viewModel.getProperty('/selectedSensorId');
    const selectedCapabilityId = this.viewModel.getProperty('/selectedCapabilityId');
    const selectedProperties = this.viewModel.getProperty('/selectedProperties');

    const filteredDeviceProperties = deviceProperties.filter(function ( property ) {
        return property.capabilityId === selectedCapabilityId
            && property.sensorId === selectedSensorId;
    });


    this.model = new JSONModel(filteredDeviceProperties);
    this.vizFrame.setModel(this.model);
    let chartData = {
        dimensions: [{
            name: 'time',
            value: {
                path: 'timestamp',
                formatter: function ( timestamp ) {
                    return new Date(timestamp);
                }
            },
            dataType: "date"
        }],
        measures: [],
        data: {
            path: '/'
        }
    };

    const dataSet = new sap.viz.ui5.data.FlattenedDataset(chartData);
    this.vizFrame.setDataset(dataSet);

    selectedProperties.forEach(function ( measure ) {
        dataSet.addMeasure(new sap.viz.ui5.data.MeasureDefinition({
            name: measure,
            value: '{measure/' + measure + '}'
        }));
    });
    this.vizFrame.addFeed(new FeedItem({
        'uid': 'timeAxis',
        'type': 'Dimension',
        'values': ['time']
    }));

    this.vizFrame.addFeed(new FeedItem({
        'uid': 'valueAxis',
        'type': 'Measure',
        'values': selectedProperties
    }));
},

[Former Member · Accepted solution]

what solved my problem was adding this to the plotArea in vizProperties:

window: {

    start: 'firstDataPoint',

    end: 'lastDataPoint' }

[Former Member]

You should see a scroll bar on the bottom of the chart if you on Chrome. There are chances that this scroll bar is vanished on IE11 if you IE11 recognizes your machine as a touch screen enabled. This is a defect on IE11 and it has been fixed on the latest SAPUI5.