переход от оси x приводит к переполнению

Прежде всего, нет: этот вопрос не о (пока) уродливом переходе линий (я мог бы открыть для этого еще один).переход от оси x приводит к переполнению

Я показываю данные в линейных диаграммах, и пользователь может выбрать временной горизонт. Таким образом, ось х соответственно переходит в соответствии с измененным временным горизонтом. В прикрепленном изображении, например, временной горизонт составлял 1 неделя, а затем я переключился на 4 недели. Количество тиков на оси х увеличивается с 7 до 28 соответственно.

Вопрос: Как предотвратить анимацию оси x за пределами контейнера SVG? Как вы можете видеть, дополнительные даты летают слева, и они анимируются далеко за пределами контейнера.

Любые идеи?

Прямо сейчас, переход работает, вероятно, самым простым способом он мог:

// format for x-axis 
var xAxis = d3.svg.axis() 
    .scale(x) 
    .orient("bottom") 
    .tickFormat(d3.time.format("%d.%m")) 
    .ticks(d3.time.days, 1) 
    .tickSubdivide(0); 

// Update x-axis 
svg.select(".x")   
    .transition() 
    .duration(500) 
    .call(xAxis);

exampleF

источник

2013-11-08 peter

Что делать, если вы устанавливаете правило CSS 'overflow: hidden' для этой части страницы? –

Ничего себе, иногда это так просто .. Большое спасибо, я не думал об этом. Doh. Если вы опубликуете это как ответ, я приму это! – peter

Я имею в виду часть страницы, которая содержит диаграмму. –

Это может работать, если вы установите правило CSS

overflow:hidden

для части страницы который содержит диаграмму.

источник

2013-11-08 21:50:15

переход от оси x приводит к переполнению

ответ

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