roundSlider - user requirement

roundSlider - user requirement

by Soundar Pandian

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/round-slider@1.6.1/dist/roundslider.min.css">
<script src="https://cdn.jsdelivr.net/npm/round-slider@1.6.1/dist/roundslider.min.js"></script>
<h2><a target="_blank" href="https://roundsliderui.com/">roundSlider - v1.6.1</a></h2>


<div id="slider"></div>

CSS

body {
  background: black !important;
  color: white;
 }

JavaScript

window.updateBox = function (e) {
	var profit = Math.round(this.options.value * 0.005);
}

window.changeTooltip = function (e) {
	updateBox.call(this);
	return e.value + "°C" ;
}

$("#slider").roundSlider({
  radius: 180,
  min: 10,
  max: 30,
  circleShape: "pie",
  sliderType: "min-range",
  value: 20,
  editableTooltip: false,
  startAngle: 315,
  tooltipFormat: "changeTooltip",
  
  svgMode: true,
  rangeColor: "#03a9f4",
  pathColor: "#eee",
  borderColor: "black",
  lineCap: "round"
  
});