AngularJS-Slider Issue Report
Fork this Fiddle to show an issue and report it here:
https://github.com/rzajac/angularjs-slider/issues
HTML
<link rel="stylesheet" href="https://rawgit.com/rzajac/angularjs-slider/master/dist/rzslider.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<script src="https://rawgit.com/rzajac/angularjs-slider/master/dist/rzslider.js"></script>
<div ng-app="myapp">
<div ng-controller="TestController as vm">
<p>Price: {{vm.priceSlider.value}}</p>
<rzslider rz-slider-model="vm.priceSlider.min" rz-slider-options="vm.priceSlider.options" rz-slider-high="vm.priceSlider.high"></rzslider>
</div>
</div>
JavaScript
var myApp = angular.module('myapp', ['rzModule']);
myApp.controller('TestController', TestController);
function TestController() {
var vm = this;
var ticksArray = [0,3,6,12,18,24,36,48,60,72,84,120,240,360,600,1200,3600];
var positions = [];
function getMultiplier(value) {
}
vm.priceSlider = {
min: 0,
high: 10,
options: {
floor: 0,
ceil: 3600,
showTicksValues: true,
step: 1,
ticksArray: ticksArray,
customValueToPosition: function(val, minVal, maxVal) {
var pos = 1/16 * (ticksArray.indexOf(val));
if (positions.indexOf(pos) === -1){
positions.push(pos);
}
return pos;
},
customPositionToValue: function(percent, minVal, maxVal) {
var index = Math.round(percent * 16);
var min = (ticksArray[index - 1]);
var max = (ticksArray[index]);
var minPos = positions[index -1];
var maxPos = positions[index];
var value = max - ((maxPos-percent)/(maxPos-minPos)) * (max - min);
return Math.round(value);
}
}
}
}