31:Ta2e,md`

This originally started as an algorithm to determine what teams to pit against eachother in debating rounds, but the same algorithm can be used for plenty other kinds of scheduling. This algorithm, I think, works when your problem can be broken down to a set of *Options* (in our case, team vs team matchups) where 1. Options can be combined to create our result In our case the result would be a *Round* with matchups, where every matchup is an *Option*. When planning a train ride, the result would be a *Schedule*, and individual train rides would be the *Option*s. 2. Options can be scored individually If we do not like teams from the same school debating against eachother, we can give an *option* a penalty (negative score) when they contain teams from the same school. As you see below in the example, we can combine penalties and rewards for options, and play with multipliers to these penalties to achieve good results. 3. A lot of options are mutually exclusive Because teams can only play one match during a round, when we pit *Team A* against *Team B* (*Option 1*), we can not also have *Team A* against *Team C* (*Option 2*). So *Option 1* and *Option 2* would be mutually exclusive. The basics of the algorithm make it so the options ranked highest, are options with high scores that are compatible (not exclusive) with other options with high scores This prevents the biggest problem with scheduling like this, where the last option you are adding (or left with) does not have a high score, because the program couldn't see into the future. ### Debate example In the example given below, we want to create a debating round between teams from different schools. We want to limit teams from the same school debating, and we want to limit big differences in debating skill. To do that I build a minimal *Team* type: ~~~js { name: string, // Name doesn't matter right now, just for visibility school: string, // School is used to give a small penalty for being "the same" level: number, // I figured I test the system a bit with an extra parameter, // where a difference between level yields a penalty } ~~~ You can edit the teams (possibly you need to fork/make an account) by clicking the **to the left** of \`teams = Array(...)\` below. It will then open a javascript editor. `32:T424,{ let algorithm_map = { Thourough: round_by_thourough_search, Naive: round_by_naive_search }; let round = algorithm_map[SELECTION_ALGORITHM]; return dedent(md)` | | In favor | Opposed | Score | Judge score | | -- | -------- | ------ | ----- | ----------- | ${round.map(matchup => { let index = matchups .indexOf(matchup) .toString() .padStart(3, '0'); let { trailer, movie, score, raw_score } = matchup; // prettier-ignore return md_row([ index, team_as_string(trailer), team_as_string(movie), score.toFixed(5), `

${raw_score.toFixed(2)}

` ]) })} Average score: **${_.mean(round.map(x => x.score)).toFixed(5)}** Use this with caution, as it is pretty tightly linked to the judge function. Meaning, if you increase the relative score for features that are present in the current round, this average will also go up slightly. `; }33:T826,{ let naive_and_thourough_are_basically_the_same = _.difference(round_by_naive_search, round_by_thourough_search).length === 0; let naive_score = _.mean(round_by_naive_search.map(x => x.score)); let thourough_score = _.mean(round_by_thourough_search.map(x => x.score)); let score_difference = Math.abs(naive_score - thourough_score); let better_algorithm = naive_score > thourough_score ? 'Naive' : 'Thourough'; let score_table = dedent()` | Algorithm | Score | | --------- | ------------------------------ | | Thourough | ${thourough_score.toFixed(10)} | | Naive | ${naive_score.toFixed(10)} | `; if (naive_and_thourough_are_basically_the_same) { return dedent(md)` The naive and thourough selection algorithms might deliver different results, but they contain the same set of matchups for the current configuration. So they are basically the same for these parameters. `; } else { if (naive_score === thourough_score) { return md` There is a difference between the naive and throurough selection algorithms results, but the total score is exactly the same. `; } if (score_difference > 0.2) { return dedent(md)` Pretty big score difference between the naive and thourough selection algorithms. ${better_algorithm} got a score that is ${score_difference.toFixed(2)} better! ${score_table} `; } if (score_difference > 0.1) { return dedent(md)` Significant score difference between the selection algorithms, but it is not too big either. ${better_algorithm} got a score that is ${score_difference.toFixed(4)} better. ${score_table} `; } return dedent(md)` Small score difference: ${score_difference.toFixed(10)} ${score_table} `; } }34:T43c,md` ## Selection algorithms I made up this term, don't @-me. The naive search takes *one ranking* and uses that to create the whole round. It goes from the top ranked matchup through the ranking to the bottom ranked matchup, and for every matchup that does not conflict with an already selected one, will put it in the round selection. Thourough is a bit more sophisticated. It will take the best matchup from the initial ranking, but then takes only the matchups that do not conflict with this matchup, and **runs the ranking again**. It will then again take the first, and repeat untill it has matched all the teams. Right now this does not make much a difference (see "Very technical options" above), but the throurough algorithm provides an example of how we could do user guided scheduling. We could show the rankings to a user, and when the user selects one they like (based on human instincts we can not automate), we run the ranking again, and show them the best options with the selected matchup in mind. I did this before actually and it worked pretty awesomely then. `35:Tc23,rank_matchups = function(matchups, generations) { // Create a matrix of all the matchups pitted against eachother. // It will contain 0 at the position if the matchups can't exist in the same round, 1 if it does. // This is not flattened, so it actually looks like // [ // [0, 1, 0, 0, 1, ...], // [1, 0, 1, 1, 1, ...], // [0, 1, 0, 0, 1, ...], // [0, 1, 0, 0, 1, ...], // [1, 1, 1, 1, 0, ...], // ... // ] const matchup_v_matchup = get_matchup_v_matchup_matrix(matchups); // Get the scores that the judge function assigned to the individual matchups. // We also normalize them, which puts them all between 0 and 1. // Every index in any "scores" array from now on, will have their index matched in the matchups array: // initial_scores[0] is a score for matchups[0], current_scores[100] is a score for matchups[100], const initial_scores = matchups.map(x => x.score); // We need this extra variable because we will update this after every generation. let current_scores = initial_scores; // Save the intial scores (this is so the "visible progress" widget can show this) let generations_result = [ _.sortBy(_.zip(matchups, current_scores), ([teams, score]) => -score) ]; // We will loop for `generations` times, but I like this more than a for loop 🙃 for (const gen of _.range(0, generations)) { // Mathematical matrix-vector mulitplication, // the "could be in the same round" matrix with the last scores we got for every matchup const raw_scores = multiply_matrix_with_vector( matchup_v_matchup, current_scores ); // This gives us the new rank, but it misses something. I tried just the above before, but that made // all the results were strange. School were pitted against eachother, even with penalties in the 1000s. // I think that is because when we just multiply with the last scores, // the "I can co-exist with X other matchups" easily outperforms any "I am actually a good matchup" metric. // To counter that, I take the new score for every matchup, and multiply it with the initial ones we saved. const with_initial_scores = multiply_vector_with_vector( raw_scores, initial_scores ); // Set and yield the new scores so we can apply those in the next generation. // The fact we keep updating the scores is the power move of this algorithm. current_scores = normalize_vector(with_initial_scores); // _.zip is really cool, it takes two arrays and "zips" them together in one new array: // _.zip([1, 2, 3, 4], ["one", "two", "three", "four"]) // = [ [1, "one"], [2, "two"], [3, "three"], [4, "four"] ] let matchups_with_their_ranking_score = _.zip(matchups, current_scores); // We use the score we just zipped with the matchups to sort them, and we save the whole thing :D generations_result.push( _.sortBy(matchups_with_their_ranking_score, ([teams, score]) => -score) ); } // In the actual thing we'd want this to just return the last result, instead of all of them return generations_result; }36:T48a,{ if (round_so_far.length === 0) { return md`As soon as you select a matchup from below, it will show up here`; } let element = html` ${dedent(md)` #### Selected matchups Average score: **${_.mean(round_so_far.map(x => x.score))}** `} ${round_so_far.map(matchup => { return html.fragment` `; })}

	In favor	Against	score
{ mutable round_so_far = round_so_far.filter( x => x !== matchup ); }} >x	${md([team_as_string(matchup.team_in_favor)])}	${md([team_as_string(matchup.team_against)])}	${matchup.score.toFixed(4)}

`; return element; }37:T758,{ let generation = PROGRESS_DEMO_GENERATION; let matchups_with_scores = progress_demo_all_generations[generation]; let progress_show = { at_top: PROGRESS_SHOW_AT_TOP, at_bottom: PROGRESS_SHOW_AT_BOTTOM }; if ( matchups_with_scores.length < PROGRESS_SHOW_AT_TOP + PROGRESS_SHOW_AT_BOTTOM ) { progress_show = { at_top: matchups_with_scores.length, at_bottom: 0 }; } let render_matchup = ([matchup, ranking_score]) => { let { team_in_favor, team_against, score } = matchup; return html.fragment`

{ mutable round_so_far = [...round_so_far, matchup]; }} >+

${team_to_html(team_in_favor)} ${team_to_html(team_against)} ${score.toFixed(3)} ${long_score_as_html(ranking_score, 18)} `; }; let hidden_row_count = matchups_with_scores.length - progress_show.at_bottom - progress_show.at_top; let element = html` Generation ${generation} ${matchups_with_scores .slice(0, progress_show.at_top) .map(render_matchup)} ${matchups_with_scores .slice(matchups_with_scores.length - progress_show.at_bottom) .map(render_matchup)}

In favor	Against	score
...	...	...
${hidden_row_count} more rows	...	...
...	...	...

`; return element; }38:[{"id":"dd419e75956124755da07d7ade8d4a3b1df0af140a605700719b3bcf73545af03fdb8dd04f46f8fc6dd8b371d2c9e5ca71c153ddce16cab6da511fe6c187a0ad","href":"https://static.observableusercontent.com/files/dd419e75956124755da07d7ade8d4a3b1df0af140a605700719b3bcf73545af03fdb8dd04f46f8fc6dd8b371d2c9e5ca71c153ddce16cab6da511fe6c187a0ad","name":"debat.jpg","type":"image/jpeg","lastModified":1583599977279.486,"size":47689}] 2f:{"title":"Debate Round Trailer Scheduler / Matcher","cells":[{"id":1416,"value":"md`# ~~Debate Round~~ Trailer Scheduler / Matcher`","pinned":false,"hidden":false,"mode":"ojs"},{"id":0,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"demo_movies = [\n { id: 1, name: \"Movie #1\", age: 16 },\n { id: 2, name: \"Movie #2\", age: 18 },\n { id: 3, name: \"Movie #3\", age: 12 }\n]","pinned":false,"hidden":false,"mode":"ojs"},{"id":1375,"value":"demo_trailers = [\n { name: 'Trailer #1', age: 12 },\n { name: 'Trailer #2', age: 16 },\n { name: 'Trailer #3', age: 21 }\n]","pinned":false,"hidden":false,"mode":"ojs"},{"id":121,"value":"md`\nHere is the other customizable part, the score calculation.\nThis function (\\`judge_matchup\\`) takes the two *Team*s, and returns a *Score*. \n\nIt can be any number, negative or positive, as it will be normalized in the end:\nall scores will be squished between \\`0\\` and \\`1\\`, proportional to the lowest and highest scores found.\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":23,"value":"judge_matchup = ({ movie, trailer }) => {\n let score = 0;\n\n score -= Math.abs(movie.age - trailer.age);\n\n return score;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":128,"value":"md`\nHere are some options to play with the algorithm.\nFeel free to alter the teams and the judge function as well.\nThe rest of the algorithms only depends on the judge function returning a number, it does not care what values are in the teams at all.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":582,"value":"viewof movie_count = slider({\n title: \"Movie count\",\n description: \"Takes the first x movies from the demo_movies array\",\n min: 1,\n max: demo_movies.length,\n step: 1,\n value: demo_movies.length\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":595,"value":"movies = demo_movies.slice(0, movie_count)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1385,"value":"viewof trailer_count = slider({\n title: \"Trailer count\",\n description: \"Takes the first x movies from the demo_trailers array\",\n min: 1,\n max: demo_trailers.length,\n step: 1,\n value: demo_trailers.length\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1393,"value":"trailers = demo_trailers.slice(0, trailer_count)","pinned":false,"hidden":false,"mode":"ojs"},{"id":191,"value":"viewof GENERATIONS = slider({\n title: \"Generations\",\n description:\n \"Cycles the algorithm goes through. Higher /should/ make the results more accurate\",\n min: 0,\n max: 20,\n step: 1,\n value: 3\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1360,"value":"md`### Judge Function parameters`","pinned":false,"hidden":false,"mode":"ojs"},{"id":304,"value":"viewof SAME_SCHOOL_PENALTY = slider({\n min: -1000,\n max: 0,\n step: 10,\n value: -100,\n title: \"Same school penalty\",\n description:\n \"How much should be reduced from a matchups score if teams come from the same school\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":310,"value":"viewof LEVEL_DIFFERENCE_MULTIPLIER = slider({\n min: 0,\n max: 10,\n step: 0.1,\n value: 1,\n title: \"Level difference multiplier\",\n description: \"Use 0 to remove the effect of level difference altogether\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":964,"value":"viewof LEVEL_DIFFERENCE_EXPONENT = slider({\n min: 0,\n max: 4,\n step: 0.1,\n value: 2,\n title: \"Level difference exponent\",\n description:\n \"Where the `Level Difference Multiplier` is linear, this one punishes bigger differences exponentially more\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":140,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":857,"value":"md`### Very technical options`","pinned":false,"hidden":false,"mode":"ojs"},{"id":845,"value":"viewof MATCHUP_SELF_COUNTS = select({\n title: \"Matchup vs self works\",\n options: [\"Yes\", \"No\"],\n description: \"I have not really an idea what kind of effect this has\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":746,"value":"viewof SELECTION_ALGORITHM = select({\n title: \"Selection algorithms\",\n description: \"The algorithms that orchestrates the whole search\",\n options: [\"Thourough\", \"Naive\"],\n value: \"Thourough\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":773,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":133,"value":"md`## Algorithm fluff`","pinned":false,"hidden":false,"mode":"ojs"},{"id":944,"value":"md`\n#### Matchups\nArray with every possible \\`{ team_in_favor: Team, team_against: Team }\\` combination we can make from the teams list. It also adds the scores, and normalizes these (so they make sense to compare)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"matchups = {\n let matchups_with_only_raw_score = _.flatten(\n movies.map(movie => {\n return trailers.map(trailer => {\n return {\n movie: movie,\n trailer: trailer,\n raw_score: judge_matchup({ movie, trailer })\n };\n });\n })\n );\n\n let normalized_scores = normalize_vector(\n matchups_with_only_raw_score.map(matchup => matchup.raw_score)\n );\n return _.zip(matchups_with_only_raw_score, normalized_scores).map(\n ([matchup, score]) => {\n return {\n ...matchup,\n score: score\n };\n }\n );\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":954,"value":"md`\n#### Matchups do conflict\nTakes two matchups (items like we have in the \\`matchups\\` array) and checks if they share a team (thus can not co-exist in one round, as a team can only play in one matchup per round)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":36,"value":"matchups_do_conflict = (matchup_1, matchup_2) => {\n let isEqual = (x, y) => x === y;\n // let isEqual = (team1, team2) => team1.name === team2.name;\n\n if (\n isEqual(matchup_1.movie, matchup_2.movie) ||\n isEqual(matchup_1.trailer, matchup_2.trailer)\n ) {\n return true;\n } else {\n return false;\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":924,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":233,"value":"round_by_naive_search = {\n const eventual_matchup_count = trailers.length;\n let selected_matchups = [];\n\n let matchups_with_scores = _.last(rank_matchups(matchups, GENERATIONS));\n\n for (let matchup of matchups_with_scores.map(([teams, score]) => teams)) {\n if (selected_matchups.length >= eventual_matchup_count) {\n break;\n }\n if (selected_matchups.some(x => matchups_do_conflict(x, matchup))) {\n continue;\n }\n selected_matchups.push(matchup);\n }\n return selected_matchups;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":327,"value":"round_by_thourough_search = {\n // precondition(teams.length % 2 === 0);\n const eventual_matchup_count = trailers.length;\n\n let selected_matchups = [];\n\n let available_matchups = matchups;\n\n for (let i of _.range(0, eventual_matchup_count)) {\n let [best_matchup, ...other_matchups] = _.last(\n rank_matchups(available_matchups, GENERATIONS)\n );\n let [matchup, score] = best_matchup;\n\n selected_matchups.push(matchup);\n available_matchups = available_matchups.filter(\n x => !matchups_do_conflict(matchup, x)\n );\n }\n\n return selected_matchups;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":830,"value":"md`\n## The actual Algorithm\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":331,"value":"get_matchup_v_matchup_matrix = matchups => {\n return matchups.map(matchup_1 => {\n return matchups.map(matchup_2 => {\n if (matchup_1 === matchup_2) {\n if (MATCHUP_SELF_COUNTS === \"Yes\") {\n return 1;\n } else {\n return 0;\n }\n }\n return matchups_do_conflict(matchup_1, matchup_2) ? 0 : 1;\n });\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":329,"value":"$35","pinned":true,"hidden":false,"mode":"ojs"},{"id":601,"value":"RoundBuilder = md`\n## Round builder\n\nI wanted to view what happens kind-of internally in the algorithm.\nThis is not showing the calculation of the best round, but only of a single \"matchup selection\" in a round.\nAt first, this was veeery weird looking, with it jumping around a lot in the initial generations. Now you will see it gets steady pretty quickly.\n\nIt does show you though that, even though a lot of levels have the same score (1.000, being perfect) at generation 0 (no actual cycle, only the original scores), at generation 1 you get a new order.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1135,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":873,"value":"viewof PROGRESS_DEMO_GENERATION = with_title({\n title: \"Generation\",\n description: \"You can drag to pause on a specific generation\",\n viewof: Scrubber(_.range(0, PROGRESS_DEMO_MAX_GENERATIONS + 1), {\n delay: 200,\n loop: false\n })\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":876,"value":"$37","pinned":false,"hidden":false,"mode":"ojs"},{"id":663,"value":"md`\n### Progress visibility appendix\nOptions and methods that assist the above demo\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":677,"value":"viewof PROGRESS_DEMO_MAX_GENERATIONS = number({\n title: 'Max generations',\n value: 20,\n min: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":719,"value":"viewof PROGRESS_SHOW_AT_TOP = slider({\n title: 'Show best matchups',\n value: 5,\n step: 1,\n min: 0,\n max: 20,\n submit: true\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":725,"value":"viewof PROGRESS_SHOW_AT_BOTTOM = slider({\n title: 'Show worst matchups',\n value: 3,\n step: 1,\n min: 0,\n max: 20,\n submit: true\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1101,"value":"mutable round_so_far = {\n rank_matchups;\n matchups;\n\n return [];\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":617,"value":"progress_demo_all_generations = {\n let available_matchups = matchups.filter(matchup =>\n round_so_far.every(\n round_matchup => !matchups_do_conflict(matchup, round_matchup)\n )\n );\n\n console.log('available_matchups:', available_matchups);\n\n return rank_matchups(available_matchups, PROGRESS_DEMO_MAX_GENERATIONS);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":441,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":523,"value":"md`\n## Display helpers\n\nVery specific helpers to transform our data into html\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1147,"value":"long_score_as_html = (score, digits = 20) => {\n return html.fragment(\n ['', ''],\n score\n .toFixed(digits)\n .split('')\n .map(\n (part, index, array) =>\n html.fragment`${part}`\n )\n );\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1151,"value":"team_to_html = team => {\n return html.fragment`\n \n ${md`${team_as_string(team)}`}\n \n `;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":379,"value":"color_for_team = ({ name, school, level }) => {\n let LEVEL_UPPER_BOUND = 20;\n let hue = number_from_string(school) % 360;\n let saturation = (level / LEVEL_UPPER_BOUND) * 30 + 30;\n let lightness = (level / LEVEL_UPPER_BOUND) * 40 + 30;\n return `hsl(${hue}, ${saturation}%, ${lightness}%)`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":314,"value":"team_as_string = team => {\n return `${team.name} - *lvl ${team.age}*`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":568,"value":"md_row = list => `| ${list.join(' | ')} |\\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":55,"value":"md`\n ## Appendix\n\n Collection of methods that are basically re-usable\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":480,"value":"md`\n#### Linear algebra\n\nI need some vector and matrix stuff, but I don't feel like importing a whole library for that 😅\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":65,"value":"multiply_matrix_with_vector = (matrix, vector) => {\n precondition(matrix.length === vector.length);\n\n return matrix.map(row => {\n precondition(row.length === vector.length);\n\n let result = 0;\n for (let i of _.range(row.length)) {\n result += row[i] * vector[i];\n }\n return result;\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":403,"value":"multiply_vector_with_vector = (vector1, vector2) => {\n return vector1.map((_, index) => vector1[index] * vector2[index]);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":52,"value":"normalize_vector = vector => {\n let highest = _.max(vector);\n let lowest = _.min(vector);\n let size = Math.abs(highest - lowest);\n\n return vector.map(x => (x - lowest) / size);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":483,"value":"md`\n#### Precondition\n\nChecks a \"condition\", and throws when it is false.\nI use this often when I want to make sure there is no error in my inputs or some intermediate value.\n\n~~~js\nprecondition(argument1.length < 10); // Will throw if argument1.length is bigger or equal to 10\nprecondition(list.every(x => x.type != null)); // Will throw if any item in the list does not have a type property\n~~~\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":67,"value":"precondition = (condition, message = \"Precondition failed\") => {\n if (!condition) {\n throw new Error(message);\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":784,"value":"md`\n#### Generator to array\n\nLike the above, it helps with generator functions. Now instead of taking only the last result, this gives you an array of all the results emitted along the way.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":468,"value":"md`\n#### Number from string\n\nI often want to color-code data pseudo-randomly, where the same value will always yield the same color, but similar strings don't generate similar colors. This will (try) to do just that\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":423,"value":"number_from_string = string => {\n var hash = 0;\n for (var i = 0; i < string.length; i++) {\n hash = string.charCodeAt(i) ** 2 + ((hash << 5) - hash);\n hash = hash & hash;\n }\n return hash;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":474,"value":"md`#### Imports`","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"_ = require('lodash')","pinned":false,"hidden":false,"mode":"ojs"},{"id":297,"value":"import { slider, number, select } from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":604,"value":"import { Scrubber } from \"@mbostock/scrubber\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":627,"value":"import { form } from \"@mbostock/form-input\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":637,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":1257,"value":"import { html, svg } from \"@observablehq/htl\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1277,"value":"import { dedent } from \"@dralletje/dedent-for-template-strings\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1309,"value":"import { with_title } from \"@dralletje/compose-viewof\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W38","stdlib":"1","titling":"auto"}