Skip to Content
avatar image
Former Member

time axis values not shown in timeseries_line chart

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
    }));
},
time-axis.png (15.8 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

2 Answers

  • Best Answer
    avatar image
    Former Member
    Sep 27, 2017 at 01:39 PM

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

    window: {
    
        start: 'firstDataPoint',
    
        end: 'lastDataPoint' }
    Add comment
    10|10000 characters needed characters exceeded

  • avatar image
    Former Member
    Dec 28, 2017 at 02:20 AM

    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.

    Add comment
    10|10000 characters needed characters exceeded