2f:T4d1,function displayEncoding(scale,type) { const nRows = 5 let tw = w/scale.domain().length let h = tw * nRows let margin = 5 const svg = d3.select(DOM.svg(2*w+margin, h+margin*2)); let dom = scale.domain() const cropList = ["circle", "rect","square", "diamond", "triangle" ] const colList = [[182,72,132],[234,62,129],[246,119,69],[46,145,80],[42,153,221]] //[159,163,73], for (let i = 0; i < nRows; ++i) { for (let j = 0; j `\n let dom = scale.domain()\n let range = scale.range()\n for (let i = 0; i < dom.length; ++i) {\n cont.append(htl.html`

${dom[i]}

`)\n }\n return cont \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":30,"value":"displayScale(scale)","pinned":true,"hidden":false,"mode":"ojs"},{"id":14,"value":"scale = { \n let [domain,range] = palette2array(palette_anxiety)\n\n return d3.scaleOrdinal(range).domain(domain) \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":39,"value":"anxiety_range = palette2array(palette_anxiety)[1]","pinned":true,"hidden":false,"mode":"ojs"},{"id":12,"value":"function palette2array(palette) {\n let range = []\n let domain = []\n \n for (const [key, value] of Object.entries(palette.data)) {\n if(value.type !== \"fake\" && key !==\"displaytype\") {\n domain.push(value.value)\n range.push(value.proto.canvas)\n }\n }\n \n return [domain,range] \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":5,"value":"d3 = require(\"d3@7\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":73,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":118,"value":"function makeOpacity(i,j,margin,tw,img,svg) {\n svg.append(\"svg:image\")\n .attr(\"xlink:href\",img)\n .attr(\"x\", margin +j*tw)\n .attr(\"y\",margin+i*tw )\n .attr(\"width\",tw)\n .attr(\"height\",tw )\n .style(\"opacity\",1-0.2*i)\n // .style(\"outline\",\"#555 solid 1px\")\n \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":127,"value":"function makeOrr(i,j,margin,tw,img,svg) {\n svg .append(\"svg:image\")\n .attr(\"xlink:href\",img)\n .attr(\"x\", margin +j*tw)\n .attr(\"y\",margin+i*tw )\n .attr(\"width\",tw)\n .attr(\"height\",tw )\n .style(\"transform-box\",\"fill-box\" )\n .style(\"transform-origin\",\"center\")\n // .style(\"outline\",\"#555 solid 1px\")\n .style(\"transform\",\"rotate(\"+(22*i)+\"deg)\")\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":143,"value":"function makeArea(i,j,margin,tw,img,svg) {\n svg .append(\"svg:image\")\n .attr(\"xlink:href\",img)\n .attr(\"x\", margin +j*tw +((tw*((0.2*i)))/2))\n .attr(\"y\",margin+i*tw )\n .attr(\"width\",tw*(1-(0.2*i)))\n .attr(\"height\",tw*(1-(0.2*i) ))\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":153,"value":"function makeHue(i,j,margin,tw,img,svg,col) {\n console.log(col)\n let color = new Color(col[0],col[1],col[2])\n let solver = new Solver(color)\n let res = solver.solve()\n \n svg .append(\"svg:image\")\n .attr(\"xlink:href\",img)\n .attr(\"x\", margin +j*tw)\n .attr(\"y\",margin+i*tw )\n .attr(\"width\",tw)\n .attr(\"height\",tw)\n .style(\"filter\", res.filter.substring(7).slice(0, -1) )\n\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":161,"value":"function makeBrightness(i,j,margin,tw,img,svg) {\n svg .append(\"svg:image\")\n .attr(\"xlink:href\",img)\n .attr(\"x\", margin +j*tw)\n .attr(\"y\",margin+i*tw )\n .attr(\"width\",tw)\n .attr(\"height\",tw)\n .style(\"filter\",\"brightness(\"+(1.2-(0.25*i))+\")\")\n \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":166,"value":"function makeBlur(i,j,margin,tw,img,svg) {\n svg .append(\"svg:image\")\n .attr(\"xlink:href\",img)\n .attr(\"x\", margin +j*tw)\n .attr(\"y\",margin+i*tw )\n .attr(\"width\",tw)\n .attr(\"height\",tw)\n .style(\"filter\",\"blur(\"+(i*1.4)+\"px)\")\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":250,"value":"function makeCrop(i,j,margin,tw,img,svg,shape) {\n\n let mess = \"\"\n if(shape===\"circle\") {\n mess = \"circle(\"+tw*0.2+\"px)\" \n }\n else if(shape===\"diamond\") {\n mess = \"polygon(50% 0, 70% 50%, 50% 100%, 30% 50%)\" \n } else if(shape===\"square\") {\n mess = \"rect(30% 70% 70% 30%)\" \n } else if(shape===\"triangle\") {\n mess = \"polygon(50% 0, 80% 50%, 20% 50%)\" \n }\n else if(shape===\"rect\") {\n mess = \"rect(40% 80% 50% 20%)\" \n }\n\n svg .append(\"svg:image\")\n .attr(\"xlink:href\",img)\n .attr(\"x\", margin +j*tw)\n .attr(\"y\",margin+i*tw )\n .attr(\"width\",tw)\n .attr(\"height\",tw)\n .style(\"clip-path\",mess)\n \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":194,"value":"function makeGray(i,j,margin,tw,img,svg) {\n svg .append(\"svg:image\")\n .attr(\"xlink:href\",img)\n .attr(\"x\", margin +j*tw)\n .attr(\"y\",margin+i*tw )\n .attr(\"width\",tw)\n .attr(\"height\",tw)\n .style(\"filter\",\"grayscale(\"+((0.25*i))+\")\")\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":84,"value":"displayEncoding(scale,\"gray\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":78,"value":"w = 600","pinned":true,"hidden":false,"mode":"ojs"},{"id":201,"value":"tList = [\"opacity\", \"rotate\", \"area\",\"hue\",\"brightness\",\"blur\", \"gray\", \"shape\" ]","pinned":true,"hidden":false,"mode":"ojs"},{"id":204,"value":"$30","pinned":true,"hidden":false,"mode":"ojs"},{"id":222,"value":"// displayGlobal()","pinned":true,"hidden":false,"mode":"ojs"},{"id":304,"value":"import {bertinScale} from \"76fa5d9344fc47de\" ","pinned":true,"hidden":false,"mode":"ojs"},{"id":306,"value":"displayEncoding(bertinScale,\"gray\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":317,"value":" displayEncoding(bertinScale,\"hue\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":327,"value":"import {Color,Solver,hexToRgb} from \"74cc23cddaf9a5e8\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}