3e:null 3f:["$","title",null,{"children":"Multiple-choice colour scale | Bob Anson | Observable"}] 45:[] 43:{"id":"6eb9645468203856","slug":null,"title":"Multiple-choice colour scale","thumbnail":"5c348ae81c42f823851f436ba7437f6ba5d80d152f2f480ee17cc4be17c2b9e1","access_level":"public","create_time":"$D2023-07-23T00:21:14.668Z","update_time":"$D2023-07-24T17:18:17.036Z","view_time":null,"first_public_time":"$D2023-07-23T00:21:14.668Z","has_unpublished_edits":null,"fork":{"id":"53f37a31b7733de5","slug":"multiple-choice-colour-scale","title":"Multiple-choice colour scale","owner":{"id":"dfc54db9de0ee0aa","login":"dhotson","name":"Dennis Hotson"}},"stars":0,"starred":false,"owner":{"type":"team","id":"a9510fb8bfbeb502","login":"54a60697c53675df","name":"Bob Anson","avatar_url":null,"tier":"starter_2024","bio":"","following":false},"version":692,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"54a60697c53675df","login":"54a60697c53675df","name":"Bob Anson","avatar_url":null,"tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"54a60697c53675df","login":"54a60697c53675df","name":"Bob Anson","avatar_url":null,"tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Multiple-choice colour scale","cells":[{"id":179,"value":"md`# Multiple-choice colour scale`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":353,"value":"viewof r = radio({\n description: 'Switch between the old and new colour schemes to compare',\n options: [\n { label: 'Old colour scale', value: 'old' },\n { label: 'New colour scale', value: 'new' }\n ],\n value: 'old'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":303,"value":"viewof c1 = color({ value: isNew ? '#e1e2ea' : d3.rgb('rgb(231, 136, 143)') })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":306,"value":"viewof c2 = color({ value: isNew ?'#c4c5d4' : d3.rgb('rgb(227, 167, 175)') })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":308,"value":"viewof c3 = color({ value: isNew ?'#a7a9c1' : d3.rgb('rgb(218, 216, 222)') })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":310,"value":"viewof c4 = color({ value: isNew ?'#898ba9' : d3.rgb('rgb(148, 157, 175)') })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":312,"value":"viewof c5 = color({ value: isNew ?'#6b6e94' : d3.rgb('rgb(105, 118, 144)') })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"viewof options = slider({\n min: 1,\n max: 9,\n step: 1,\n value: 5,\n title: 'Number of choices'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"{\n let container = html`

`;\n for (let i=0; iOption ${i+1}
Contrast: ${isNew ? Math.max(lightTextContrast, darkTextContrast) : lightTextContrast}%`)\n }\n\n return container;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":522,"value":"{ \n\n const rows = 5; // ref rating_scale\n//options are KPIs\n let container2 = html`

`;\n\n //header\n for (let hdr=0; hdrKPI- ${hdr+1}
`)\n }\n \n for (let i=0; iKPI-${j+1} Score${i+1}
`);\n\n } // j-loop\n\n } // i-loop\n \n\n return container2;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":506,"value":"md`\nNote: Colour contrast is calculated in the [Hue-Chroma-Luminance](https://en.wikipedia.org/wiki/HCL_color_space) colour space that accounts for how humans perceive brightness.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":272,"value":"rating_scale = ({ 0:c1, 1:c2, 2:c3, 3:c4, 4:c5})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"colorScale = rescaleDomain(scaleFromObject(rating_scale), [0, options-1])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":465,"value":"isNew = r === 'new'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"/**\n * Creates a d3 scale using `obj`'s keys as the domain and\n * `obj`'s values as the range.\n *\n * @param {string|Function} scaleCreator - either a d3.scale\n * constructor or the name of one, for example, `d3.scale.linear`\n * or \"linear\".\n *\n * @param {Object} obj - the object whose keys and values represent\n * the scale's domain and range, respectively.\n *\n * @return {Function} the created scale\n */\nfunction scaleFromObject(obj) {\n const scaleCreator = d3.scale.linear\n \n console.log(obj)\n const [keys, values] = _(obj)\n .pairs()\n .unzip()\n .value()\n\n return scaleCreator()\n .domain(keys)\n .range(values)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"/**\n * Transforms a d3 scale by scaling its domain up or down.\n *\n * @param {Function} originalScale the d3.scale object to scale\n *\n * @param {Array} newDomain - the new domain for the created scale. Only\n * two values may be supplied, and are interpreted as [min, max].\n */\nfunction rescaleDomain(originalScale, newDomain) {\n if (newDomain.length !== 2) {\n throw new Error(\n `newDomain must be a two-element array. Got: ${JSON.stringify(newDomain)}`\n )\n }\n\n const origDomain = originalScale.domain()\n\n const transormedDomain = origDomain.map(\n d3.scale\n .linear()\n .domain(d3.extent(origDomain))\n .range(newDomain)\n )\n\n return originalScale.copy().domain(transormedDomain)\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"d3 = require(\"d3@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"_ = require(\"lodash@3.5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":263,"value":"import {slider, color, radio} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W45","stdlib":"1"}} 44:"$43:body"