Jan 09, 2018 at 08:46 AM
dynamisches Erzeugen von Timelines funktioniert nicht, warum?
Hallo,
ich habe eine Tabelle, welche dynamisch erzeugt wird und wenn ich einzelne Zeilen markiere und auf einem Button klicke erzeugt es mir in einem Dialogfenster mehrere Verlaufsdiagramme untereinender. Mein Problem ist, dass die Daten richtig übermittelt werden aber viele Diagramme leer bleiben und manche richtig funktionieren und ich bin ratlos warum es so ist.
Das Objekt besteht aus Datumsangaben und den dazugehörigen Werten. Aber nicht zu jedem Datum gibt es einen Wert.
Ein funktionierendes:
DatenObjekrt:
Objectrow:Array(70)0:{date: "17.08.2017 07:45:17", value: ""}1:{date: "17.08.2017 09:33:19", value: ""}2:{date: "23.08.2017 08:34:03", value: "139"}3:{date: "23.08.2017 17:04:00", value: ""}4:{date: "24.08.2017 07:00:19", value: ""}5:{date: "24.08.2017 07:00:32", value: "137"}6:{date: "24.08.2017 15:05:00", value: ""}7:{date: "25.08.2017 06:00:27", value: ""}8:{date: "25.08.2017 07:00:57", value: "135"}9:{date: "25.08.2017 11:09:00", value: ""}10:{date: "25.08.2017 16:00:11", value: ""}11:{date: "25.08.2017 16:00:28", value: ""}12:{date: "26.08.2017 04:00:01", value: ""}13:{date: "26.08.2017 06:00:19", value: ""}14:{date: "26.08.2017 07:00:24", value: "141"}15:{date: "26.08.2017 10:00:52", value: ""}16:{date: "26.08.2017 11:00:20", value: ""}17:{date: "26.08.2017 16:00:37", value: ""}18:{date: "26.08.2017 16:00:58", value: ""}19:{date: "26.08.2017 22:00:31", value: ""}20:{date: "27.08.2017 06:00:28", value: ""}21:{date: "27.08.2017 07:00:49", value: "141"}22:{date: "27.08.2017 11:00:48", value: ""}23:{date: "27.08.2017 14:15:55", value: ""}24:{date: "27.08.2017 16:00:52", value: ""}25:{date: "27.08.2017 20:00:29", value: ""}26:{date: "28.08.2017 02:00:39", value: ""}27:{date: "28.08.2017 06:00:31", value: ""}28:{date: "28.08.2017 07:00:01", value: "145"}29:{date: "28.08.2017 08:00:57", value: ""}30:{date: "28.08.2017 11:00:41", value: ""}31:{date: "28.08.2017 14:00:14", value: ""}32:{date: "28.08.2017 16:00:11", value: ""}33:{date: "29.08.2017 06:00:36", value: ""}34:{date: "29.08.2017 07:00:15", value: "144"}35:{date: "29.08.2017 11:00:59", value: ""}36:{date: "29.08.2017 12:46:59", value: ""}37:{date: "29.08.2017 16:00:02", value: ""}38:{date: "30.08.2017 06:00:56", value: ""}39:{date: "30.08.2017 07:00:14", value: ""}40:{date: "30.08.2017 07:00:23", value: "144"}41:{date: "30.08.2017 07:50:04", value: ""}42:{date: "30.08.2017 11:00:38", value: ""}43:{date: "30.08.2017 13:14:55", value: ""}44:{date: "30.08.2017 16:00:54", value: ""}45:{date: "31.08.2017 06:00:37", value: ""}46:{date: "31.08.2017 08:00:26", value: ""}47:{date: "31.08.2017 15:01:08", value: ""}48:{date: "01.09.2017 07:00:58", value: "137"}49:{date: "01.09.2017 12:40:27", value: ""}50:{date: "02.09.2017 07:00:04", value: "138"}51:{date: "03.09.2017 07:00:40", value: "142"}52:{date: "04.09.2017 07:00:49", value: "142"}53:{date: "05.09.2017 07:00:02", value: ""}54:{date: "05.09.2017 10:29:16", value: ""}55:{date: "05.09.2017 10:45:54", value: ""}56:{date: "06.09.2017 07:00:00", value: "143"}57:{date: "06.09.2017 08:59:30", value: ""}58:{date: "06.09.2017 11:20:47", value: ""}59:{date: "06.09.2017 13:30:06", value: ""}60:{date: "07.09.2017 06:00:00", value: ""}61:{date: "07.09.2017 07:00:15", value: ""}62:{date: "07.09.2017 14:35:42", value: ""}63:{date: "08.09.2017 06:57:10", value: ""}64:{date: "08.09.2017 08:00:30", value: "141"}65:{date: "09.09.2017 07:00:46", value: "142"}66:{date: "09.09.2017 09:43:52", value: ""}67:{date: "09.09.2017 12:51:23", value: ""}68:{date: "10.09.2017 07:00:55", value: ""}69:{date: "11.09.2017 07:00:11", value: "146"}length:70__proto__:Array(0)__proto__:Object
-----------------------------------------------------------------------------------------------------------------------ein nicht funktionierendes:
Datenobjekt:
{row: Array(70)}row:Array(70)0:{date: "17.08.2017 07:45:17", value: ""}1:{date: "17.08.2017 09:33:19", value: ""}2:{date: "23.08.2017 08:34:03", value: ""}3:{date: "23.08.2017 17:04:00", value: ""}4:{date: "24.08.2017 07:00:19", value: ""}5:{date: "24.08.2017 07:00:32", value: ""}6:{date: "24.08.2017 15:05:00", value: ""}7:{date: "25.08.2017 06:00:27", value: "7.59"}8:{date: "25.08.2017 07:00:57", value: ""}9:{date: "25.08.2017 11:09:00", value: ""}10:{date: "25.08.2017 16:00:11", value: "7.01"}11:{date: "25.08.2017 16:00:28", value: ""}12:{date: "26.08.2017 04:00:01", value: ""}13:{date: "26.08.2017 06:00:19", value: "5.92"}14:{date: "26.08.2017 07:00:24", value: ""}15:{date: "26.08.2017 10:00:52", value: ""}16:{date: "26.08.2017 11:00:20", value: "8.11"}17:{date: "26.08.2017 16:00:37", value: ""}18:{date: "26.08.2017 16:00:58", value: "6.71"}19:{date: "26.08.2017 22:00:31", value: ""}20:{date: "27.08.2017 06:00:28", value: "4.79"}21:{date: "27.08.2017 07:00:49", value: ""}22:{date: "27.08.2017 11:00:48", value: "4.63"}23:{date: "27.08.2017 14:15:55", value: ""}24:{date: "27.08.2017 16:00:52", value: "6.70"}25:{date: "27.08.2017 20:00:29", value: ""}26:{date: "28.08.2017 02:00:39", value: ""}27:{date: "28.08.2017 06:00:31", value: "5.23"}28:{date: "28.08.2017 07:00:01", value: ""}29:{date: "28.08.2017 08:00:57", value: ""}30:{date: "28.08.2017 11:00:41", value: "5.15"}31:{date: "28.08.2017 14:00:14", value: ""}32:{date: "28.08.2017 16:00:11", value: "5.41"}33:{date: "29.08.2017 06:00:36", value: "5.14"}34:{date: "29.08.2017 07:00:15", value: ""}35:{date: "29.08.2017 11:00:59", value: "5.02"}36:{date: "29.08.2017 12:46:59", value: ""}37:{date: "29.08.2017 16:00:02", value: "7.08"}38:{date: "30.08.2017 06:00:56", value: "5.58"}39:{date: "30.08.2017 07:00:14", value: ""}40:{date: "30.08.2017 07:00:23", value: ""}41:{date: "30.08.2017 07:50:04", value: ""}42:{date: "30.08.2017 11:00:38", value: "5.38"}43:{date: "30.08.2017 13:14:55", value: ""}44:{date: "30.08.2017 16:00:54", value: "7.45"}45:{date: "31.08.2017 06:00:37", value: "5.28"}46:{date: "31.08.2017 08:00:26", value: ""}47:{date: "31.08.2017 15:01:08", value: ""}48:{date: "01.09.2017 07:00:58", value: ""}49:{date: "01.09.2017 12:40:27", value: ""}50:{date: "02.09.2017 07:00:04", value: ""}51:{date: "03.09.2017 07:00:40", value: ""}52:{date: "04.09.2017 07:00:49", value: ""}53:{date: "05.09.2017 07:00:02", value: ""}54:{date: "05.09.2017 10:29:16", value: ""}55:{date: "05.09.2017 10:45:54", value: ""}56:{date: "06.09.2017 07:00:00", value: ""}57:{date: "06.09.2017 08:59:30", value: ""}58:{date: "06.09.2017 11:20:47", value: ""}59:{date: "06.09.2017 13:30:06", value: ""}60:{date: "07.09.2017 06:00:00", value: ""}61:{date: "07.09.2017 07:00:15", value: ""}62:{date: "07.09.2017 14:35:42", value: ""}63:{date: "08.09.2017 06:57:10", value: ""}64:{date: "08.09.2017 08:00:30", value: ""}65:{date: "09.09.2017 07:00:46", value: ""}66:{date: "09.09.2017 09:43:52", value: ""}67:{date: "09.09.2017 12:51:23", value: ""}68:{date: "10.09.2017 07:00:55", value: ""}69:{date: "11.09.2017 07:00:11", value: ""}length:70__proto__:Array(0)__proto__:Object
-----------------------------------------------------------------------------------------------------------------------
Das ist der Quellcode:
onGraphicPress : function(){
var table = this.getView().byId("idTable");
//console.log(table.getColumns());
//var numberDiag = table.getSelectedIndex();
//alert(this.getView().byId("idTable").getParameters().columnIndex);
var selectedRow = table.getSelectedIndices();
var columns = table.getColumns();
graphicDiag = undefined;
if(!graphicDiag){
graphicDiag = new sap.m.Dialog({
title: "Verlaufsdiagramme",
resizable: true,
draggable: true,
beginButton: new sap.m.Button({
text: "Schließen",
press: function () {
graphicDiag.close();
}
})
});
var objTable = {};
objTable.row =[];
//objTable.date = [];
//console.log(table.getRows()[0].getCells()[0].getText());
for (var u=0; u<selectedRow.length;u++){
if(table.getRows()[selectedRow[u]]){
var i=1;
while(table.getRows()[selectedRow[u]].getCells()[i]!= null){
i++;
}
i--;
var name = table.getRows()[selectedRow[u]].getCells()[0].getText();
while(i>0){
if (table.getRows()[selectedRow[u]].getCells()[i].getText().indexOf("*")!= -1){
var valueArr = table.getRows()[selectedRow[u]].getCells()[i].getText().split("* ")[1];
}else{
valueArr = table.getRows()[selectedRow[u]].getCells()[i].getText();
}
if (valueArr.indexOf(" ")){
var value = valueArr.split(" ")[0];
}else{ value = valueArr;}
var date = columns[i].getLabel().getText();
var obj = {
"date": date,
"value": value
};
objTable.row.push(obj);
i--;
}
var nullNr=0;
for(var y=1;y<objTable.row.length;y++){
if(objTable.row[y].value!= ""){
//alert(objTable.row[y].value);
nullNr++;
}
}
//alert(nullNr);
if(nullNr!=0){
var viz = self.diag(name,diagNr, objTable);
graphicDiag.addContent(viz);
}
diagNr++;
//console.log(objTable);
objTable = {};
objTable.row =[];
//objTable.date = [];
}
}
self.getView().addDependent(graphicDiag);
}
graphicDiag.open();
},
diag: function(name, diagNr, objTable){
//1.Get the id of the VizFrame
//var oVizFrame = this.getView().byId("idcolumn");
console.log(objTable);
var oVizFrame = undefined;
if (!oVizFrame){
oVizFrame = new sap.viz.ui5.controls.VizFrame({
xmlns: "sap.viz",
id: "idcolumn"+diagNr,
height: "300px",
vizType : "timeseries_line"
});
}
//2.Create a JSON Model and set the data
var oModel = new sap.ui.model.json.JSONModel();
oModel.setData(objTable);
var og, ug;
var diagName = name;
for (var i=0; i< oMeasurands.length;i++){
if (oMeasurands[i].MeasurandName == diagName){
for(var x=0;x<oResults.length;x++){
if(oMeasurands[i].MeasurandId == oResults[x].MeasurandId){
var tolerance = oResults[x].NormRange;
break;
}
}
}
}
//console.log(tolerance);
if (tolerance !== undefined){
if (tolerance.indexOf("-")!= -1){
ug = tolerance.split("-")[0];
og = tolerance.split("-")[1];
}
if (tolerance.indexOf("<")!= -1){
og = tolerance.split("<")[1];
}
if(tolerance.indexOf(">")!= -1){
ug = tolerance.split(">")[1];
}
}
//objTable.row.shift();
console.log("Toleranz: "+ tolerance+" OG: "+og+" UG: "+ug);
//3. Create Viz dataset to feed to the data to the graph
var oDataset = new sap.viz.ui5.data.FlattenedDataset({
dimensions : [{
name : "Datum und Uhrzeit",
value : "{date}",
dataType : "date"
}],
measures : [
{
name : "Wert",
value : "{value}"
}],
data : {
path : "/row"
}
});
oVizFrame.setDataset(oDataset);
oVizFrame.setModel(oModel);
//oVizFrame.setVizType("timeseries_line");
oVizFrame.setVizProperties({
title: {
text: diagName+" "+tolerance
},
valueAxis: {
title: {
visible: false
}
},
timeAxis: {
levels: [ "second", "minute", "hour","day","month","year"],
title: {
visible: false
}
},
legend : {
visible: false
},
plotArea: {
colorPalette : ["#0101DF"],
//marker:{visible : false},
dataPoint:{invalidity: "ignore"},
referenceLine: {
line: {
valueAxis: [{
value: og,
visible: true,
size: 1,
type: "dotted",
label: {
text: "Obergrenze",
visible: true
}
},{
value: ug,
visible: true,
size: 1,
type: "dotted",
label: {
text: "Untergrenze",
visible: true
}
}]
}},
dataLabel: {
visible: false
},
window: {
start: "firstDataPoint",
end: "lastDataPoint"
}
}
}
);
oVizFrame.setUiConfig({"applicationSet" : "fiori"});
var feedCategoryAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
"uid": "timeAxis",
"type": "Dimension",
"values": ["Datum und Uhrzeit"]
}),
feedValueAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
"uid": "valueAxis",
"type": "Measure",
"values": ["Wert"]
});
oVizFrame.addFeed(feedCategoryAxis);
oVizFrame.addFeed(feedValueAxis);
return oVizFrame;
}
});