I am working with an angular scope variable that is being used in ng-repeat. My goal is to create a chart that starts from a specific date, ends at another date, and includes a marker for the current day. I am utilizing loader.js for drawing the charts in JavaScript, but since I need to draw multiple charts inside ng-repeat, my code structure has become a bit complex:
$scope.items = [{"title1":"start_day: 01-01-2017", "end_day:15-02-2018"},
{"title2":"start_day: 05-10-2017", "end_day:10-01-2019"}];
Here is the snippet of JavaScript code using Google Charts:
anychart.onDocumentReady(function () {
// create data tree on our data
var treeData = anychart.data.tree(getData());
// create resource gantt chart
var chart = anychart.ganttResource();
// set container id for the chart
chart.container('container');
// set data for the chart
chart.data(treeData);
// set start splitter position settings
chart.splitterPosition(150);
var now = (new Date()).getTime();
var sec = 1000;
var min = 60*sec;
var hour = 60*min;
var day = 24*hour;
// create linemarkers
var tl = chart.getTimeline();
tl.lineMarker(0).value("current");
// get chart data grid link to set column settings
var dataGrid = chart.dataGrid();
// initiate chart drawing
chart.draw();
// zoom chart to specified date
chart.fitAll();
});
function getData() {
var now = (new Date()).getTime();
var sec = 1000;
var min = 60*sec;
var hour = 60*min;
var day = 24*hour;
return [
{
"periods": [
{"id": "1_1", "start": now - 365*day, "end": now + 100*day }]
},
];
}
I would like to dynamically pass the dates from the angularjs scope variable into the JavaScript code above, replacing the existing data for start and end. Additionally, I need to calculate the difference between the dates. Thank you in advance! :)