{"action":"created","issue":{"url":"https://api.github.com/repos/leongersen/noUiSlider/issues/497","repository_url":"https://api.github.com/repos/leongersen/noUiSlider","labels_url":"https://api.github.com/repos/leongersen/noUiSlider/issues/497/labels{/name}","comments_url":"https://api.github.com/repos/leongersen/noUiSlider/issues/497/comments","events_url":"https://api.github.com/repos/leongersen/noUiSlider/issues/497/events","html_url":"https://github.com/leongersen/noUiSlider/issues/497","id":100900704,"number":497,"title":"Better explanation of how density works in pips?","user":{"login":"carlinyuen","id":422877,"avatar_url":"https://avatars.githubusercontent.com/u/422877?v=3","gravatar_id":"","url":"https://api.github.com/users/carlinyuen","html_url":"https://github.com/carlinyuen","followers_url":"https://api.github.com/users/carlinyuen/followers","following_url":"https://api.github.com/users/carlinyuen/following{/other_user}","gists_url":"https://api.github.com/users/carlinyuen/gists{/gist_id}","starred_url":"https://api.github.com/users/carlinyuen/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/carlinyuen/subscriptions","organizations_url":"https://api.github.com/users/carlinyuen/orgs","repos_url":"https://api.github.com/users/carlinyuen/repos","events_url":"https://api.github.com/users/carlinyuen/events{/privacy}","received_events_url":"https://api.github.com/users/carlinyuen/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/leongersen/noUiSlider/labels/Documentation","name":"Documentation","color":"bfd4f2"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":4,"created_at":"2015-08-14T00:26:13Z","updated_at":"2016-04-13T15:12:50Z","closed_at":null,"body":"Hi there, I'm using your library which is great, but I'm trying to reduce the number of pips, and the denisty / scaling factor doesn't seem to work intuitively. Can you help explain how it works? This is my code:\r\n\r\n    // Income slider\r\n    incomeSlider = document.getElementById('incomeSlider');\r\n    noUiSlider.create(incomeSlider, {\r\n      start: CONST.defaultIncome,\r\n      step: 1000, // Slider moves in increments\r\n      connect: \"lower\",\r\n      range: { // Slider can select range\r\n        'min': 20000,\r\n        'max': 150000\r\n      },\r\n      pips: { // Show a scale with the slider\r\n        mode: 'steps',\r\n        density: 50,     // <-- it doesn't seem to matter what this value is, nothing happens\r\n        filter: function ( value, type ) {\r\n          return ((value % 10000) ? 0 : 2);\r\n        },\r\n        format: {\r\n          to: function ( value ) {\r\n            return (value + \"\").slice(0, -3) + 'k';\r\n          },\r\n          from: function ( value ) {\r\n            return value.replace('k', '000');\r\n          }\r\n        }\r\n      }\r\n    });\r\n\r\nAnd it ends up looking like this, with too many pips in between:\r\n![screen shot 2015-08-13 at 8 26 36 pm](https://cloud.githubusercontent.com/assets/422877/9264889/aa22be34-41f9-11e5-8593-b491e48f2d65.png)\r\n\r\nI've tried setting the density value to 0.5 all the way to 2000 and nothing seems to change."},"comment":{"url":"https://api.github.com/repos/leongersen/noUiSlider/issues/comments/209500575","html_url":"https://github.com/leongersen/noUiSlider/issues/497#issuecomment-209500575","issue_url":"https://api.github.com/repos/leongersen/noUiSlider/issues/497","id":209500575,"user":{"login":"Ixalmida","id":4041273,"avatar_url":"https://avatars.githubusercontent.com/u/4041273?v=3","gravatar_id":"","url":"https://api.github.com/users/Ixalmida","html_url":"https://github.com/Ixalmida","followers_url":"https://api.github.com/users/Ixalmida/followers","following_url":"https://api.github.com/users/Ixalmida/following{/other_user}","gists_url":"https://api.github.com/users/Ixalmida/gists{/gist_id}","starred_url":"https://api.github.com/users/Ixalmida/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Ixalmida/subscriptions","organizations_url":"https://api.github.com/users/Ixalmida/orgs","repos_url":"https://api.github.com/users/Ixalmida/repos","events_url":"https://api.github.com/users/Ixalmida/events{/privacy}","received_events_url":"https://api.github.com/users/Ixalmida/received_events","type":"User","site_admin":false},"created_at":"2016-04-13T15:12:50Z","updated_at":"2016-04-13T15:12:50Z","body":"Thanks for the info, airtonix!\r\n\r\nNow if only there could be a split pip density to match the split numeric density.  For example:\r\n\r\n```\r\n        // Range: $20,000 to $5,000,00 with midpoint at $150,000\r\n        noUiSlider.create(slider, {\r\n            range: {\r\n                'min': [20000, 1000],    // Amount changes by $1,000 increments\r\n                '50%': [150000, 10000],  // Amount changes by $10,000 increments\r\n                'max': [5000000]\r\n            },\r\n            start: 50000,\r\n            step: 1000,\r\n            connect: 'lower',\r\n            pips: {\r\n                mode: 'range',\r\n                density: [ 10, 3 ],    // ...or maybe: [ 'min': 10, '50%': 3]\r\n                format: wNumb({\r\n                    decimals: 0,\r\n                    prefix: '$',\r\n                    thousand: ','\r\n                })\r\n            }\r\n        });\r\n```\r\n"}}