Can I send optional fields in crossfilter when i making dimension for color coding perspective in dc.rowChart()?

Question

I recently started to use dc.js for my chart creation because it efficiently use crossfilter instance for event handling across different charts. which made dc.js pretty awesome.

But there is also some disadvantages:

when it comes from group & coloring functionality.

Note:- I put here sample data for my problem.

suppose, i have this kind of data. like

machine = ["abc_1", "abc_2"]
component = ["comp_1", "comp_2"]
service = ["ser_1", "ser_2", "ser_3", "ser_4"]

here, if you watch below it's like nested json or tree hierarchy form where

machine is depend on component

{ 
    "abc_1":["comp_1", "comp_2"],
    "abc_2": ["comp_1"]
}

and component is depend on service

{
    "comp_1": ["ser_1", "ser_2", "ser_3"],
    "comp_2": ["ser_2", "ser_4"]
}

then, i convert all tree form hierarchy json in flat json form which crossfilter have required.

[
    {'machine': 'abc_1', 'service_status': 0, 'component': 'comp_2', 'service': 'ser_1', 'component_status': 1}, {'machine': 'abc_1', 'service_status': 1, 'component': 'comp_2', 'service': 'ser_2', 'component_status': 1}, {'machine': 'abc_1', 'service_status': 0, 'component': 'comp_2', 'service': 'ser_3', 'component_status': 1}, {'machine': 'abc_1', 'service_status': 1, 'component': 'comp_2', 'service': 'ser_4', 'component_status': 1}, {'machine': 'abc_1', 'service_status': 1, 'component': 'comp_1', 'service': 'ser_1', 'component_status': 1}, {'machine': 'abc_1', 'service_status': 1, 'component': 'comp_1', 'service': 'ser_2', 'component_status': 1}, {'machine': 'abc_1', 'service_status': 1, 'component': 'comp_1', 'service': 'ser_3', 'component_status': 1}, {'machine': 'abc_1', 'service_status': 0, 'component': 'comp_1', 'service': 'ser_4', 'component_status': 1}, {'machine': 'abc_2', 'service_status': 0, 'component': 'comp_2', 'service': 'ser_1', 'component_status': 0}, {'machine': 'abc_2', 'service_status': 0, 'component': 'comp_2', 'service': 'ser_2', 'component_status': 0}, {'machine': 'abc_2', 'service_status': 0, 'component': 'comp_2', 'service': 'ser_3', 'component_status': 0}, {'machine': 'abc_2', 'service_status': 0, 'component': 'comp_2', 'service': 'ser_4', 'component_status': 0}, {'machine': 'abc_2', 'service_status': 1, 'component': 'comp_1', 'service': 'ser_1', 'component_status': 1}, {'machine': 'abc_2', 'service_status': 1, 'component': 'comp_1', 'service': 'ser_2', 'component_status': 1}, {'machine': 'abc_2', 'service_status': 1, 'component': 'comp_1', 'service': 'ser_3', 'component_status': 1}, {'machine': 'abc_2', 'service_status': 0, 'component': 'comp_1', 'service': 'ser_4', 'component_status': 1}
]

at this stage i load my json and started a crossfilter instance

var ndx = crossfilter(data);

then i create dimensions here

var dim = ndx.dimension(function(d){ return d["component"]; });
var grp = dim.group();

when i print this grp by write a custom print function it showing like

[
    {"key": "comp_1", value:7 },
    {"key": "comp_2", value:4 }
]

now, when i pass this dim & grp in dc.js construct it showing like same. it pickup only particular fields and its count and send to dc construct. which causes i can't create custom coloring if i want to show running not running status with coloring.

Now, i put this dim & grp in dc.rowChart()

dc.rowChart("#abc")
    .dimension(dim)
    .group(grp);

dc.renderAll();

when i draw this all bars showing different colors. but i want these colors on the basis of status like 0:"red" & 1:"green".

i can do hack but please suggest me right way to play with it. i want to make

donut for machines, rowchart for compoonts, rowchart for services

and i also want event handling between these charts. i will be appreciate only genuine answer.