javascript - d3 getting invert value of Band Scales

Question

i am writing a Gantt Chart using d3

i have xScale with Time Scale(Time)

this.xScale = d3.scaleTime()
            .domain([this.startDate,this.endDate])
            .range([0,this.getWidth()]);

and yScale as Band Scale (Resources)

this.yScale = d3.scaleBand()
        .domain(resources.map(function(res){
            return res.res_num;
        }))
        .rangeRound([0,this.getHeight()])
        .paddingInner(.3)

Problem is i need to drag and drop the task( SVG Rect) from one resource to another resources

When i drag i am using the transfrom so its moving on the SVG

_onDrag : function(d)
    {
        var x = d3.event.dx+d3.event.x;
        var y = d3.event.dy+d3.event.y;
        d3.select(this).raise().attr("transform","translate(" + [x,y] + ")");
    },

But on drop i have to handle the logic as below:

1. the rect should not be in between the resources, so need to transform to any band based on d3.event.y
   2. in xAxis the time scale which has the invert but the yScale not have this. How to do this?

Answer 1

Solved this as below but i don't know this is standard way, if any other way please answer to this.

var eachBand = self.yScale.step();
var index = Math.round((d3.event.y / eachBand));
var val = self.yScale.domain()[index];

eachBand gives the size of the band in pixels if i divide the y value (drag event) by the eachBand i will get the index which gives the yScale value