30:Tdb1,schemes = { return ({ 'Original Ladybug': [[75, 107, 169], [115, 147, 202], [170, 200, 247], [193, 213, 208], [245, 239, 103], [252, 230, 74], [239, 156, 21], [234, 123, 0], [234, 74, 0], [234, 38, 0]], 'Nuanced Ladybug': [[49, 54, 149], [69, 117, 180], [116, 173, 209], [171, 217, 233], [224, 243, 248], [255, 255, 191], [254, 224, 144], [253, 174, 97], [244, 109, 67], [215, 48, 39], [165, 0, 38]], // 2: _multicolored, 'Multi-colored Ladybug': [[4, 25, 145], [7, 48, 224], [7, 88, 255], [1, 232, 255],[97, 246, 156], [166, 249, 86], [254, 244, 1], [255, 121, 0],[239, 39, 0], [138, 17, 0]], 'Ecotect':[[0, 0, 255], [53, 0, 202], [107, 0, 148], [160, 0, 95], [214, 0, 41],[255, 12, 0], [255, 66, 0], [255, 119, 0], [255, 173, 0], [255, 226, 0],[255, 255, 0]], 'View Study':[[255, 20, 147], [240, 47, 145], [203, 117, 139], [160, 196, 133],[132, 248, 129], [124, 253, 132], [96, 239, 160], [53, 217, 203],[15, 198, 240], [0, 191, 255]], 'Shadow Study':[[55, 55, 55], [235, 235, 235]], 'Glare Study':[[156, 217, 255], [255, 243, 77], [255, 115, 0], [255, 0, 0], [0, 0, 0]], 'Annual Comfort':[[0, 0, 0], [110, 0, 153], [255, 0, 0], [255, 255, 102], [255, 255, 255]], 'Thermal Comfort':[[0, 136, 255], [200, 225, 255], [255, 255, 255],[255, 230, 230], [255, 0, 0]], 'Peak Load Balance':[[255, 251, 0], [255, 0, 0], [148, 24, 24], [135, 178, 224],[255, 175, 46], [255, 242, 140], [204, 204, 204]], 'Heat Sensation':[[255, 255, 255],[255, 230, 230], [255, 0, 0]], 'Cold Sensation':[[255, 255, 255], [200, 225, 255], [0, 136, 255]], 'Benefit/Harm':[[0, 191, 48], [255, 238, 184], [255, 0, 0]], 'Harm':[[255, 238, 184], [255, 0, 0]], 'Benefit':[[255, 238, 184],[0, 191, 48]], 'Shade Benefit/Harm':[[5, 48, 97], [33, 102, 172], [67, 147, 195], [146, 197, 222],[209, 229, 240], [255, 255, 255], [253, 219, 199],[244, 165, 130], [214, 96, 77], [178, 24, 43], [103, 0, 31]], 'Shade Harm':[[255, 255, 255], [253, 219, 199],[244, 165, 130], [214, 96, 77], [178, 24, 43], [103, 0, 31]], 'Shade Benefit':[[255,255,255],[209,229,240],[146,197,222],[67,147,195],[33,102,172],[5,48,97]], 'Energy Balance':[[138,17,0],[239,39,0],[255,121,0],[254,244,1],[166,249,86],[97,246,156],[1,232,255],[7,88,255],[7,48,224],[4,25,145]], 'Energy Balance w/ Storage':[[138,17,0],[239,39,0],[255,121,0],[254,244,1],[166,249,86],[97,246,156],[1,232,255],[7,88,255],[7,48,224],[4,25,145],[128,102,64]], 'THERM':[[0, 0, 0], [137, 0, 139], [218, 0, 218], [196, 0, 255], [0, 92, 255],[0, 198, 252], [0, 244, 215], [0, 220, 101], [7, 193, 0], [115, 220, 0],[249, 251, 0], [254, 178, 0], [253, 77, 0], [255, 15, 15],[255, 135, 135], [255, 255, 255]], 'Cloud Cover':[[0, 251, 255], [255, 255, 255], [217, 217, 217], [83, 114, 115]], 'Black to White':[[0, 0, 0], [255, 255, 255]], 'Blue, Green, Red':[[0, 0, 255], [0, 255, 100], [255, 0, 0]], 'Multicolored 2':[[0, 16, 120], [38, 70, 160], [5, 180, 222], [16, 180, 109], [59, 183, 35], [143, 209, 19], [228, 215, 29], [246, 147, 17],[243, 74, 0], [255, 0, 0]], 'Multicolored 3':[[69, 92, 166], [66, 128, 167], [62, 176, 168], [78, 181, 137],[120, 188, 59], [139, 184, 46], [197, 157, 54], [220, 144, 57],[228, 100, 59], [233, 68, 60]], 'OpenStudio Palette':[[230, 180, 60], [230, 215, 150], [165, 82, 0],[128, 20, 20], [255, 128, 128], [64, 128, 128],[128, 128, 128], [255, 128, 128], [128, 64, 0],[64, 180, 255], [160, 150, 100], [120, 75, 190], [255, 255, 200],[0, 128, 0]] }) }31:T105b,function legend({ color, title, tickSize = 6, width = 600, height = 44 + tickSize, marginTop = 18, marginRight = 0, marginBottom = 16 + tickSize, marginLeft = 0, ticks = width / 64, tickFormat, tickValues } = {}) { const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .style("overflow", "visible") .style("display", "block"); let tickAdjust = g => g.selectAll(".tick line").attr("y1", marginTop + marginBottom - height); let x; // Continuous if (color.interpolate) { const n = Math.min(color.domain().length, color.range().length); x = color.copy().rangeRound(d3.quantize(d3.interpolate(marginLeft, width - marginRight), n)); svg.append("image") .attr("x", marginLeft) .attr("y", marginTop) .attr("width", width - marginLeft - marginRight) .attr("height", height - marginTop - marginBottom) .attr("preserveAspectRatio", "none") .attr("xlink:href", ramp(color.copy().domain(d3.quantize(d3.interpolate(0, 1), n))).toDataURL()); } // Sequential else if (color.interpolator) { x = Object.assign(color.copy() .interpolator(d3.interpolateRound(marginLeft, width - marginRight)), {range() { return [marginLeft, width - marginRight]; }}); svg.append("image") .attr("x", marginLeft) .attr("y", marginTop) .attr("width", width - marginLeft - marginRight) .attr("height", height - marginTop - marginBottom) .attr("preserveAspectRatio", "none") .attr("xlink:href", ramp(color.interpolator()).toDataURL()); // scaleSequentialQuantile doesn’t implement ticks or tickFormat. if (!x.ticks) { if (tickValues === undefined) { const n = Math.round(ticks + 1); tickValues = d3.range(n).map(i => d3.quantile(color.domain(), i / (n - 1))); } if (typeof tickFormat !== "function") { tickFormat = d3.format(tickFormat === undefined ? ",f" : tickFormat); } } } // Threshold else if (color.invertExtent) { const thresholds = color.thresholds ? color.thresholds() // scaleQuantize : color.quantiles ? color.quantiles() // scaleQuantile : color.domain(); // scaleThreshold const thresholdFormat = tickFormat === undefined ? d => d : typeof tickFormat === "string" ? d3.format(tickFormat) : tickFormat; x = d3.scaleLinear() .domain([-1, color.range().length - 1]) .rangeRound([marginLeft, width - marginRight]); svg.append("g") .selectAll("rect") .data(color.range()) .join("rect") .attr("x", (d, i) => x(i - 1)) .attr("y", marginTop) .attr("width", (d, i) => x(i) - x(i - 1)) .attr("height", height - marginTop - marginBottom) .attr("fill", d => d); tickValues = d3.range(thresholds.length); tickFormat = i => thresholdFormat(thresholds[i], i); } // Ordinal else { x = d3.scaleBand() .domain(color.domain()) .rangeRound([marginLeft, width - marginRight]); svg.append("g") .selectAll("rect") .data(color.domain()) .join("rect") .attr("x", x) .attr("y", marginTop) .attr("width", Math.max(0, x.bandwidth() - 1)) .attr("height", height - marginTop - marginBottom) .attr("fill", color); tickAdjust = () => {}; } svg.append("g") .attr("transform", `translate(0,${height - marginBottom})`) .call(d3.axisBottom(x) .ticks(ticks, typeof tickFormat === "string" ? tickFormat : undefined) .tickFormat(typeof tickFormat === "function" ? tickFormat : undefined) .tickSize(tickSize) .tickValues(tickValues)) .call(tickAdjust) .call(g => g.select(".domain").remove()) .call(g => g.append("text") .attr("x", marginLeft) .attr("y", marginTop + marginBottom - height - 6) .attr("fill", "currentColor") .attr("text-anchor", "start") .attr("font-weight", "bold") .attr("class", "title") .text(title)); return svg.node(); }32:T663,function swatches({ color, columns = null, format = x => x, swatchSize = 15, swatchWidth = swatchSize, swatchHeight = swatchSize, marginLeft = 0 }) { const id = DOM.uid().id; if (columns !== null) return html`

${color.domain().map(value => { const label = format(value); return html`

${document.createTextNode(label)}

`; })}

`; return html`

${color.domain().map(value => html`${document.createTextNode(format(value))}`)}

`; }33:[] 2e:{"title":"Ladybug Tools Color Schemes","cells":[{"id":0,"value":"# Ladybug Tools Color Schemes\n\nColor schemes native to the popular [Ladybug Tools](https://www.ladybug.tools/)","pinned":false,"hidden":false,"mode":"md"},{"id":210,"value":"viewof search = Inputs.search([...Object.keys(schemesHex), ...vtkSchemes], {placeholder: \"Search Color Schemes\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":33,"value":"viewof schemeName = Inputs.select(search, {width:138})","pinned":false,"hidden":false,"mode":"ojs"},{"id":31,"value":"legend({\n color: d3.scaleOrdinal(Array.from(new Array(scheme.length), (v, i) => i), scheme),\n title: \"LBT Ordinal\",\n tickSize: 0\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":41,"value":"legend({\n color: d3.scaleSequential([0,scheme.length], chroma.scale(scheme)),\n title: \"LBT Interpolated\",\n tickSize: 0\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":90,"value":"swatches({\n color: d3.scaleOrdinal(Array.from(new Array(scheme.length), (v, i) => i), scheme)\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":150,"value":"scheme = Object.keys(schemesHex).includes(schemeName) ? schemesHex[schemeName] : getVtkColorScheme(schemeName)","pinned":false,"hidden":false,"mode":"ojs"},{"id":366,"value":"

","pinned":false,"hidden":false,"mode":"html"},{"id":369,"value":"### LBT Color Schemes as VTK Color Transfer Functions","pinned":false,"hidden":false,"mode":"md"},{"id":464,"value":"legend({\n color: d3.scaleOrdinal(Array.from(new Array(lbtScheme.length), (v, i) => i), lbtScheme),\n title: \"LBT via VTK\",\n tickSize: 0\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":623,"value":"legend({\n color: d3.scaleSequential([0,lbtScheme.length], chroma.scale(lbtScheme)),\n title: \"LBT via VTK Interpolated\",\n tickSize: 0\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":702,"value":"swatches({\n color: d3.scaleOrdinal(Array.from(new Array(lbtScheme.length), (v, i) => i), lbtScheme)\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":690,"value":"lbtScheme = Object.keys(schemesHex).includes(schemeName) ? lbtViaVtk[schemeName] : getVtkColorScheme(schemeName)","pinned":false,"hidden":false,"mode":"ojs"},{"id":448,"value":"lbtViaVtk = \n Object.keys(schemes).reduce((p,c,i) => { \n p[c] = getVtkColorScheme(c, schemes[c].length)\n return p\n }, {})","pinned":false,"hidden":false,"mode":"ojs"},{"id":771,"value":"#### Download lbtColorMaps for lbt scheme in vtk json format","pinned":false,"hidden":false,"mode":"md"},{"id":763,"value":"lbtColorMaps = {\n return Object.keys(schemes).map((val) => lbtTovtk(val))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":384,"value":"lbtTovtk = (name) => {\n let RGBPoints = [].concat.apply([], schemes[name].map((rgb,i, a) => [i / (a.length - 1), ...chroma(rgb).gl().slice(0, 3)]))\n let ColorSpace = \"RGB\"\n let NanColor = [1,0,1]\n return {ColorSpace, Name: name, NanColor, RGBPoints}\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":414,"value":"Object.keys(schemes).forEach(val => vtk.Rendering.Core.vtkColorTransferFunction.vtkColorMaps.addPreset(lbtTovtk(val)))","pinned":false,"hidden":false,"mode":"ojs"},{"id":110,"value":"

","pinned":false,"hidden":false,"mode":"html"},{"id":138,"value":"### VTK Schemes","pinned":false,"hidden":false,"mode":"md"},{"id":118,"value":"vtkSchemes = vtk.Rendering.Core.vtkColorTransferFunction.vtkColorMaps.rgbPresetNames","pinned":false,"hidden":false,"mode":"ojs"},{"id":160,"value":"getVtkColorScheme = (name, _size) => {\n let preset = Object.keys(schemes).includes(name) ? lbtTovtk(name) : vtk.Rendering.Core.vtkColorTransferFunction.vtkColorMaps.getPresetByName(name)\n let size = _size || 10\n let transfer = vtk.Rendering.Core.vtkColorTransferFunction.newInstance()\n transfer.applyColorMap(preset)\n transfer.setMappingRange(0, size - 1)\n transfer.updateRange()\n return Array.from(Array(size), (v, i) => i).map(val => transfer.mapValue(val).slice(0,3)).map(rgb => chroma(rgb).hex())\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":83,"value":"

","pinned":false,"hidden":false,"mode":"html"},{"id":106,"value":"### LBT Color Schemes","pinned":false,"hidden":false,"mode":"md"},{"id":28,"value":"schemesHex = Object.entries(schemes).reduce((p,c,i) => {\n p[c[0]] = c[1].map(val => chroma(val).hex())\n return p\n}, {})","pinned":false,"hidden":false,"mode":"ojs"},{"id":25,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"

","pinned":false,"hidden":false,"mode":"html"},{"id":163,"value":"chunk = (array, n) => Array.from(Array(Math.floor(array.length/n)), (x,i) => i).map((x,i) => array.slice(i*n,i*n+n))","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"function ramp(color, n = 256) {\n const canvas = DOM.canvas(n, 1);\n const context = canvas.getContext(\"2d\");\n for (let i = 0; i < n; ++i) {\n context.fillStyle = color(i / (n - 1));\n context.fillRect(i, 0, 1, 1);\n }\n return canvas;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":3,"value":"function entity(character) {\n return `&#${character.charCodeAt(0).toString()};`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":19,"value":"

","pinned":false,"hidden":false,"mode":"html"},{"id":327,"value":"vtk = {\n await import('https://cdn.skypack.dev/vtk.js@19.1.0?min')\n return window.vtk\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":18,"value":"chroma = require('chroma-js')","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}