2013-12-04 6 views
4

Мне нужна помощь в получении координат X и Y в виде сложенной гистограммы для каждого прямоугольника в сложной гистограмме.X Y Координаты Stacked Bar

Я здесь создаю новый прямоугольник при наведении. Я хочу, чтобы он был создан с правой стороны верхней части зависающего прямоугольника сложенной гистограммы.

Вот мышь над функцией, которую я определил, проблема заключается в том, что она дает значение y только первого прямоугольника сложенной строки.

 
function movein() { 
    var allRect = d3.selectAll("rect") 
        // .transition() 
        // .duration(300) 
        .attr("opacity", 0) 
        .attr("display", "none") 

    d3.select(this) 
     .attr("opacity", 1) 
     .attr("display", "block") 


     d3.select('.g') 
     .append("rect") 
     .attr("y", function(d) { return y(d.y1); }) 
     .attr("x", 100) 
     .attr("height", 50) 
     .attr("width", 0) 
     .attr("z-index", 1000) 
     .attr("class", "rect-sec") 

     d3.select('.rect-sec') 
     .transition() 
     .duration(300) 
     .attr("width", 200) 
    }; 

Кто-то, пожалуйста, помощь в получении X и Y координаты каждого прямоугольника сложенной панели на парении.

Это link, где я ссылаюсь на сложную гистограмму.

+0

Вы не указали функцию '.on (" mouseover "', но внутри вы получаете доступ к текущему элементу, используя 'd3.select (this)'. –

+0

Выше указана функция «mouseover», он выглядит так: .on («mouseover», movein) '. Вы хотите весь код? –

+1

Итак, вы бы сделали' d3.select (this) .attr ("x") ', чтобы получить координату x в данный момент выбран 'rect'. –

ответ

2

Вы можете выбрать this внутри обработчика, чтобы получить доступ к текущему элементу, то есть вы могли бы сделать

var x = d3.select(this).attr("x"); 

, чтобы получить доступ к координате х.

+0

Можете ли вы l и я знаю, как я смогу получить координацию выборочного бара? Предположим, что координаты 2-го или 3-го столбцов совпадают. –

+0

Вам нужно будет идентифицировать этот бар (например, по его данным), а затем получить координату аналогичным образом. –

+0

Если я назначаю класс, он применим ко всем барам. И используя данные, как я смогу это сделать. В моем случае данные являются динамическими, и они будут часто меняться. Можете ли вы сообщить, как я буду идентифицировать панель с ее данными? –

Смежные вопросы