31:[] 2f:{"title":"D3 Tween Animation for Numeric Expression","cells":[{"id":0,"value":"md`# D3 Tween Animation for Numeric Expression\n## numeric interpolation with ease in/out animation\n- https://github.com/d3/d3-interpolate\n- https://github.com/d3/d3-ease\n- by sungryeol park\n`","pinned":true,"hidden":false,"mode":"ojs"},{"id":42,"value":"viewof easeType = html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":2,"value":"viewof min = slider({min: 0, max: 10000000, value: 0, step: 1})","pinned":true,"hidden":false,"mode":"ojs"},{"id":5,"value":"viewof max = slider({min: 0, max: 10000000, value: 500000, step: 1})","pinned":true,"hidden":false,"mode":"ojs"},{"id":19,"value":"number = {\n let interpolationCount = 0;\n while(interpolationCount < 1) {\n interpolationCount += 0.01\n const easedCount = d3[easeType](interpolationCount)\n // call with .requestAnimationFrame() in real-life usage\n // https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame\n yield d3.interpolateRound(min,max)(easedCount)\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":20,"value":"d3 = require('d3@v5')","pinned":true,"hidden":false,"mode":"ojs"},{"id":14,"value":"import {slider, color, input} from '@jashkenas/inputs'","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}