Кисть D3 - отключить поведение при изменении размера в d3 v5

Я пытаюсь создать элемент слайдера (очень похожий на элемент диапазона ввода в HTML5), используя кисти d3.js.

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

Вот мой прогресс на данный момент:

 var width = 640,
            height = 480,
            margin = {
                right: 30,
                left: 30
            }

        var svg = d3.select('body')
            .append('svg')
            .attr('width', width)
            .attr('height', height)

        var xScale = d3.scaleLinear()
            .domain([0, 180])
            .range([0, width])
            .clamp(true) //May not be required in version 5

        svg.append('g')
            .attr('class', 'x axis')
            .attr('transform', 'translate(50,100)')
            .call(d3.axisBottom()
                .scale(xScale)
                .tickSize(0)
                .tickFormat("")
            )

        var brush = d3.brushX()
            .extent([
                [0, 0],
                [width, 20]
            ])
            .on('brush', brushed)

        var brushg = svg.append('g')
            .attr('class', 'brush')
            .call(brush)
            .attr('transform', 'translate(50,100)')

        brushg.selectAll(".resize").remove();

        function brushed() {
        }


        brush.move(brushg, [0, 20].map(xScale));
.brush .extent {
            fill-opacity: .125;
            shape-rendering: crispEdges;
        }
        
        g.brush>.resize {
            display: none;
        }
        
        .handle {
            pointer-events: none;
        }
<script src = "https://d3js.org/d3.v5.min.js"></script>

Кроме того, приведенный ниже фрагмент (упомянутый во многих сообщениях и примерах) больше не работает?

brush.selectAll(".resize").remove(); 

Это проблема конкретной версии? Как я могу отключить изменение размера кисти, не усложняя исходный код в версии 5 d3?

Я не слежу за вашим вопросом: сниппет является работает.

Gerardo Furtado 02.05.2018 03:04

извините, если вопрос был неясным .... я просто хочу, чтобы эта начальная нарисованная кисть перетаскивалась слева направо ... в настоящее время ее размер не может быть изменен из исходного положения (потому что ручки отключены), однако, если я перетащу курсор перекрестия куда-то вперед кисти он рисует новую кисть, размер которой изменяется ... я хочу добиться чего-то вроде jsbin.com/hahigafodi/edit?html,css,js,output, но в d3 v5

D_S_X 02.05.2018 09:44
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
2
588
0

Другие вопросы по теме