[dc.js] line chart

check colour is set properly after update (line AND dots)

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.1/crossfilter.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.3.3/d3.min.js"></script>
<script src="http://dc-js.github.io/dc.js/js/dc.js"></script>
<link rel="stylesheet" href="http://dc-js.github.io/dc.js/css/dc.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.7.0/moment.min.js"></script>
<svg id="line1"></svg>
<svg id="line2"></svg>
<svg id="line3"></svg>

CSS

svg {
  height: 280px;
  width: 500px;
}

.greendot {
  stroke: green !important;
  fill: green !important;
  fill-opacity: 1 !important;
}

.reddot {
  stroke: red !important;
  fill: red !important;
  fill-opacity: 1 !important;
}

.pinkdot {
  stroke: pink;
  fill: pink;
  fill-opacity: 1 !important;
}

JavaScript

clearconsole();
var chartHeight = 250;
var chartWidth = 500;
var myCSV = [	
  {"shift":"1","date":"01/01/2016/08/00/00/+0500","car":"178","truck":"125","bike":"317","moto":"237"},
  {"shift":"2","date":"01/01/2016/17/00/00/+0500","car":"125","truck":"189","bike":"125","moto":"273"},
  {"shift":"3","date":"02/01/2016/08/00/00/-0500","car":"140","truck":"219","bike":"328","moto":"1252"},
  {"shift":"4","date":"02/01/2016/17/00/00/+0500","car":"222","truck":"290","bike":"432","moto":"378"},
  {"shift":"5","date":"03/01/2016/08/00/00/+0500","car":"200","truck":"250","bike":"420","moto":"319"},
  {"shift":"6","date":"03/01/2016/17/00/00/+0500","car":"230","truck":"220","bike":"310","moto":"413"},
  {"shift":"7","date":"04/01/2016/08/00/00/+0500","car":"155","truck":"177","bike":"377","moto":"180"},
  {"shift":"8","date":"04/01/2016/17/00/00/+0500","car":"179","truck":"203","bike":"405","moto":"222"},
  {"shift":"9","date":"05/01/2016/08/00/00/+0500","car":"208","truck":"185","bike":"360","moto":"195"},
  {"shift":"10","date":"05/01/2016/17/00/00/+0500","car":"150","truck":"290","bike":"315","moto":"280"},
  {"shift":"11","date":"06/01/2016/08/00/00/+0500","car":"200","truck":"220","bike":"350","moto":"205"},
  {"shift":"12","date":"06/01/2016/17/00/00/+0500","car":"230","truck":"170","bike":"390","moto":"400"}
];
var testdate1 = +new Date('Sun Jan 03 2016 08:00:00 GMT-0500 (Eastern Standard Time)');
lc1 = dc.lineChart("#line1");
lc2 = dc.lineChart("#line2");
lc3 = dc.lineChart("#line3");

var dateFormat = d3.time.format("%d/%m/%Y/%H/%M/%S/%Z");
myCSV.forEach(function (d) {
	d.date = dateFormat.parse(d.date);
	d.car = +d.car;
	d.bike = +d.bike;
	d.moto = +d.moto;
});

var facts = crossfilter(myCSV);

var dateDim = facts.dimension(function (d) {return d.date});
var carDim = facts.dimension(function (d) {return d['car']});
var dgCar = dateDim.group().reduceSum(function (d) {return d['car']});
var bikeDim = facts.dimension(function (d) {return d['bike']});
var dgBike =...