Slider with JavaScript. Custom. CSS. TouchUp

[Juan_Antonio]

2.- Circular Slider with JavaScript.

Code adapted to App Inventor from...

SVG Circular Range Slider Example

Creative Circular Range Slider With JavaScript And SVG | CSS Script

p169C4_javascript_deslizadorcirculo.aia (6.8 KB)

 updateLegendUI(currentAngle) {
        const targetSlider = this.activeSlider.getAttribute('data-slider');
        const targetLegend = document.querySelector(`li[data-slider="${targetSlider}"] .sliderValue`);
        const currentSlider = this.sliders[targetSlider];
        const currentSliderRange = currentSlider.max - currentSlider.min;
        let currentValue = currentAngle / this.tau * currentSliderRange;
        const numOfSteps =  Math.round(currentValue / currentSlider.step);
        currentValue = currentSlider.min + numOfSteps * currentSlider.step;
     //   targetLegend.innerText = currentValue;
		 window.AppInventor.setWebViewString("" +  currentValue + currentSlider.color) ;
    }