2c:null 2d:["$","title",null,{"children":"Log slider | Sylvain Lesage | Observable"}] 32:T649,function logSlider(options = {}) { if (options.min !== undefined && options.min <= 0) { throw new RangeError(`min option must be strictly positive`); } if (options.max !== undefined && options.max <= 0) { throw new RangeError(`min option must be strictly positive`); } const min = options.min !== undefined ? options.min : 0.01; const max = options.max !== undefined ? options.max : 1; const getValue = options.getValue !== undefined ? options.getValue : input => input.value; const precision = options.precision !== undefined ? options.precision : 2; const clamp = x => Math.max(min, Math.min(max, x)); const logMin = Math.log10(min); const logMax = Math.log10(max); const logGetValue = input => clamp( Math.round(Math.pow(10, precision + +getValue(input))) * Math.pow(10, -precision) ); const logValue = options.value !== undefined ? Math.log10(options.value) : (logMin + logMax) / 2; const logStep = "any"; const control = slider({ ...options, min: logMin, max: logMax, value: logValue, step: logStep, getValue: logGetValue }); // Hack to transform the value before setting it. It would be better to provide // an option for it in https://observablehq.com/@severo/inputs-setter // Thanks to https://observablehq.com/@chonghorizons for pointing the bug const setValue = control.setValue; control.setValue = function(value) { if (value <= 0) { throw new RangeError(`the value must be strictly positive`); } setValue.call(this, Math.log10(value)); }; return control; }33:[{"id":"f40ad81cae5c6cd7b5ab1a9284be765849ea9db0d1e85084f6e21b97b1682684ed350b874a6b55916ba88b7e445af508d4d8d4d127ab1e5b360011f79f1580b5","href":"https://static.observableusercontent.com/files/f40ad81cae5c6cd7b5ab1a9284be765849ea9db0d1e85084f6e21b97b1682684ed350b874a6b55916ba88b7e445af508d4d8d4d127ab1e5b360011f79f1580b5","name":"log slider bug.png","type":"image/png","lastModified":1605970655944.592,"size":4390}] 30:{"id":"f407132152a9d20b","slug":"log-slider","title":"Log slider","thumbnail":"5e808c27331d8d2e04ba71df96182182db9afca2e0a0304c4fdf4d9017566e35","access_level":"public","create_time":"$D2020-11-20T17:02:56.231Z","update_time":"$D2021-01-14T09:51:04.223Z","view_time":null,"first_public_time":"$D2020-11-20T18:27:26.873Z","fork":false,"stars":2,"starred":false,"owner":{"type":"team","id":"5c7b4ebed88da11a","login":"severo","name":"Sylvain Lesage","avatar_url":"https://avatars-next.observableusercontent.com/7713195c83e5bfd8090ffe70c871c23e743c711e9e712675c99a8960ca8c7944","tier":"starter_2024"},"version":211,"publish_version":211,"role":null,"authored":false,"authors":[{"type":"individual","id":"bf1872cca880d345","login":"severo","name":"Sylvain Lesage","avatar_url":"https://avatars-next.observableusercontent.com/7713195c83e5bfd8090ffe70c871c23e743c711e9e712675c99a8960ca8c7944","tier":null}],"members":[{"type":"individual","id":"bf1872cca880d345","login":"severo","name":"Sylvain Lesage","avatar_url":"https://avatars-next.observableusercontent.com/7713195c83e5bfd8090ffe70c871c23e743c711e9e712675c99a8960ca8c7944","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":5,"collection":{"id":"a048411b727e4888","slug":"inputs","title":"Inputs","owner":{"id":"5c7b4ebed88da11a","login":"severo","name":"Sylvain Lesage"}},"type":"notebook","body":{"title":"Log slider","cells":[{"id":0,"value":"md`# Log slider\n\nA log-scale version of the [\\`slider\\`](https://observablehq.com/@jashkenas/inputs#sliderDemo) input by @jashkenas¹.\n\n~~~js\nimport {logSlider} from '@severo/log-slider'\n~~~\n\nIt uses a logarithmic scale instead of a linear scale between min and max, and thus is adapted for ratios, ie between 0.001 and 1000.\n\n*Warning*: the values must be strictly positive. An exception is thrown if \\`min\\` or \\`max\\` options are negative or equal to zero.\n\nThat's the reason why some default values differ from @jashkenas' \\`select\\`:\n\n- \\`min\\`: \\`0.01\\` instead of \\`0\\`\n- \\`value\\`: ${tex`\\exp\\left(\\frac{\\ln\\left(min\\right) + \\ln\\left(max\\right)}{2}\\right)`} instead of ${tex`\\frac{min + max}{2}`}\n- step: ignored, forced to \"any\". Use \\`precision\\` instead.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"md`## Examples`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"viewof a = logSlider()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"viewof a1 = logSlider({\n min: 0.01,\n max: 1,\n step: 0.01,\n format: \".0%\",\n description: \"0.01 to one, formatted as a percentage\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"viewof a1_1 = logSlider({\n min: 0.01,\n max: 1,\n step: 0.01,\n format: v => `${Math.round(100 * v)} per cent`,\n description: \"0.01 to one, formatted with a custom function\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"viewof a2 = logSlider({\n min: 1,\n max: 1e9,\n precision: -3,\n value: 3250000,\n format: \",\",\n description:\n \"One to one billion, in steps of one thousand, formatted as a (US) number\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":113,"value":"viewof a3 = logSlider({\n min: 1,\n max: 100,\n precision: 0,\n value: 10,\n title: \"Integers\",\n description: \"Integers from one through 100\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":117,"value":"viewof a4 = logSlider({\n min: 0.9,\n max: 1.1,\n precision: 3,\n description: \"A high precision slider example\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":127,"value":"viewof a5 = slider({\n min: 0.9,\n max: 1.1,\n precision: 3,\n submit: true,\n description: \"The same as a4, but only changes value on submit\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":190,"value":"viewof a6 = logSlider({ description: \"Use .setValue() to update the value\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"{\n const form = html``;\n form.half.onclick = () => {\n viewof a6.setValue(a6 / 2);\n };\n form.double.onclick = () => {\n viewof a6.setValue(a6 * 2);\n };\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":143,"value":"md`---\n\n¹ I use \"by @jashkenas\" because as a non-native English speaker, I don't understand the subtleties between @jashkenas' (_The Associated Press Stylebook_) and @jashkenas's (_The Chicago Manual of Style_), and couldn't decide.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"md`---\n\n### Credits\n\n_Developed for the [LIRIS M2i project](https://projet.liris.cnrs.fr/mi2/) by Sylvain Lesage._\n\n_Contribution by [@chonghorizons](https://observablehq.com/@chonghorizons) (fix the setter)_\n\n---\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"md`### CHANGELOG\n\n- 2021/01/14: fix the .setValue() method. Thanks to [@chonghorizons](https://observablehq.com/@chonghorizons)\n- 2020/11/20: creation\n\n### TODO\n\n- use \\`step\\` option to set the precision, instead of ignoring it (ie. step=10 will set precision=-1)\n- when precision is set, use toFixed in format option in order to avoid values such as 3.0000000002\n- fix a precision bug?\n\n

\n \n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"md`### Code`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"md`### Dependencies`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"//import { slider } from '@jashkenas/inputs'\nimport { slider } from '@severo/inputs-setter'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 31:"$30:body"