I have this JSON code:
{"cols":[{"label":"ID","type":"number"},
{"label":"Naziv","type":"string"},
{"label":"Vrsta","type":"string"},
{"label":"Status","type":"string"},
{"label":"Opis","type":"string"},
{"label":"Pocetak","type":"date"},
{"label":"Zavrsetak","type":"date"},
{"label":"Odgovoran","type":"string"},
{"label":"Parcela","type":"string"},
{"label":"Usluzno?","type":"string"},
{"label":"id_parcele","type":"string"}],
"rows":[{"c":[{"v":1},{"v":"Priprema"},
{"v":"navodnjavanje"},
{"v":"U pripremi"},
{"v":"Da se izrzi nadovdnjavanje"},
{"v":"Date(2014, 02, 25)"},
{"v":"Date(2014, 02, 28)"},
{"v":"Laza Lazic"},
{"v":"Njiva 5"},
{"v":"NE"},
{"v":"0"}]},
{"c":[{"v":2},
{"v":"Djubrenje"},
{"v":"djubrenje"},
{"v":"U toku"},
{"v":"Vrsi se djubrenje parcele na temp. od oko 12C"},
{"v":"Date(2014, 02, 28)"},
{"v":"Date(2014, 03, 05)"},
{"v":"Pera Peric"},
{"v":"vocnjak 3"},
{"v":"DA"},
{"v":"0"}]},
{"c":[{"v":34},
{"v":"Hemijska analiza"},
{"v":"odrzavanje, navodnjavanje, "},
{"v":"U toku"},
{"v":"Da se izvrsi hemijska analiza"},
{"v":"Date(2013, 04, 25)"},
{"v":"Date(2013, 04, 30)"},
{"v":""},
{"v":"Vocnjak N, Moja parcela N, "},
{"v":""},
{"v":"3, 11, "}]},
{"c":[{"v":25},
{"v":"sklas"},
{"v":"obrada tla, zastita, skladistenje"},
{"v":"U planu"},
{"v":"testiranje"},
{"v":"Date(2013, 04, 17)"},
{"v":"Date(2013, 04, 30)"},
{"v":""},
{"v":"Vocnjak N, S4, Moja parcela N, Parcela 3n "},
{"v":""},
{"v":"3, 19, 11, 13"}]}
]}
So "Pocetak" and "Zavrsetak" is a Date type. (Start - End dates). I try with this code below to show TimeLine.
CODE:
var timeline = new google.visualization.TimeLine({
'chartType': 'TimeLine',
'containerId': 'chart5',
'cssClassNames': 'cssClassNames',
'options': {
cssClassNames: cssClassNames,
allowHtml: true
}
});
and offcource bind timeline:
bind([categoryPicker, stringFilter, stringFilter1, slider], [table, timeline]).
but dont work, also I dont get any error. Just I dont see anything, no table, no timeline. Witout timeline code all works fine. How to solve this. How to show timeline with objects?
First, you need to use a ChartWrapper, not a Timeline object:
var timeline = new google.visualization.TimeLine(...);
should be:
var timeline = new google.visualization.ChartWrapper(...);
Then you need to set the columns to use for the Timeline in the ChartWrapper's view.columns
parameter:
var timeline = new google.visualization.ChartWrapper({
chartType: 'Timeline',
containerId: 'chart5',
options: {
// these options don't do anything in the Timeline chart
cssClassNames: cssClassNames,
allowHtml: true
},
view: {
// as an example, use columns "Naziv", "Vrsta", "Pocetak", and "Zavrsetak" for the timeline
columns: [1, 2, 5, 6]
}
});