21:null 22:["$","title",null,{"children":"TensorFlow.js LAB01: How to make decisions using weights and a decision matrix | Gerard Sans | Observable"}] 27:T517,t2 = html`

Decision Matrix	Weights	A	B	C	A	B	C
Price	${r1}	${tableData[0].A}*${r1}	${tableData[0].B}*${r1}	${tableData[0].C}*${r1}	${parseFloat(data[0].score).toFixed(1)}	${parseFloat(data[1].score).toFixed(1)}	${parseFloat(data[2].score).toFixed(1)}
Reputation	${r2}	${tableData[1].A}*${r2}	${tableData[1].B}*${r2}	${tableData[1].C}*${r2}	${parseFloat(data[3].score).toFixed(1)}	${parseFloat(data[4].score).toFixed(1)}	${parseFloat(data[5].score).toFixed(1)}
Sustainability	${r3}	${tableData[2].A}*${r3}	${tableData[2].B}*${r3}	${tableData[2].C}*${r3}	${parseFloat(data[6].score).toFixed(1)}	${parseFloat(data[7].score).toFixed(1)}	${parseFloat(data[8].score).toFixed(1)}
Total scores					${parseFloat(data_total[0].score).toFixed(1)}	${parseFloat(data_total[1].score).toFixed(1)}	${parseFloat(data_total[2].score).toFixed(1)}

`28:Td2f,// Copyright 2021 Observable, Inc. // Released under the ISC license. // https://observablehq.com/@d3/pie-chart function PieChart(data, { name = ([x]) => x, // given d in data, returns the (ordinal) label value = ([, y]) => y, // given d in data, returns the (quantitative) value title, // given d in data, returns the title text width = 640, // outer width, in pixels height = 400, // outer height, in pixels innerRadius = 0, // inner radius of pie, in pixels (non-zero for donut) outerRadius = Math.min(width, height) / 2, // outer radius of pie, in pixels labelRadius = (innerRadius * 0.2 + outerRadius * 0.5), // center radius of labels format = ",", // a format specifier for values (in the label) names, // array of names (the domain of the color scale) colors, // array of colors for names stroke = innerRadius > 0 ? "none" : "white", // stroke separating widths strokeWidth = 1, // width of stroke separating wedges strokeLinejoin = "round", // line join of stroke separating wedges padAngle = stroke === "none" ? 1 / outerRadius : 0, // angular separation between wedges } = {}) { // Compute values. const N = d3.map(data, name); const V = d3.map(data, value); const I = d3.range(N.length).filter(i => !isNaN(V[i]) && Math.round(V[i])); // Unique the names. if (names === undefined) names = N; names = new d3.InternSet(names); // Chose a default color scheme based on cardinality. if (colors === undefined) colors = d3.schemeSpectral[names.size]; if (colors === undefined) colors = d3.quantize(t => d3.interpolateSpectral(t * 0.8 + 0.1), names.size); // Construct scales. const color = d3.scaleOrdinal(names, colors); // Compute titles. if (title === undefined) { const formatValue = d3.format(format); title = i => `${N[i]}\n${formatValue(V[i])}`; } else { const O = d3.map(data, d => d); const T = title; title = i => T(O[i], i, data); } // Construct arcs. const arcs = d3.pie().padAngle(padAngle).sort(null).value(i => V[i])(I); const arc = d3.arc().innerRadius(innerRadius).outerRadius(outerRadius); const arcLabel = d3.arc().innerRadius(labelRadius).outerRadius(labelRadius); const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [-width / 2, -height / 2, width, height]) .attr("style", "max-width: 100%; height: auto; height: intrinsic;"); svg.append("g") .attr("stroke", stroke) .attr("stroke-width", strokeWidth) .attr("stroke-linejoin", strokeLinejoin) .selectAll("path") .data(arcs) .join("path") .attr("fill", d => color(N[d.data])) .attr("d", arc) .append("title") .text(d => title(d.data)); svg.append("g") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("text-anchor", "middle") .selectAll("text") .data(arcs) .join("text") .attr("transform", d => `translate(${arcLabel.centroid(d)})`) .selectAll("tspan") .data(d => { const lines = `${title(d.data)}`.split(/\n/); return (d.endAngle - d.startAngle) > 0.25 ? lines : lines.slice(0, 1); }) .join("tspan") .attr("x", 0) .attr("y", (_, i) => `${i * 1.1}em`) .attr("font-weight", (_, i) => i ? null : "bold") .text(d => d); return Object.assign(svg.node(), {scales: {color}}); }29:[] 25:{"id":"d3c608707aab0e08","slug":"tensorflow-js-demo-1-how-to-make-decisions-using-weights-and","title":"TensorFlow.js LAB01: How to make decisions using weights and a decision matrix","thumbnail":"d59ff8c5651d0a9cd0d8b5acfc2eaba7bd5c030d1d1e9ba5da9eebde350715bb","access_level":"public","create_time":"$D2022-08-25T15:06:40.657Z","update_time":"$D2022-08-25T15:11:31.828Z","view_time":null,"first_public_time":"$D2022-08-25T15:07:49.302Z","has_unpublished_edits":null,"fork":true,"stars":1,"starred":false,"owner":{"type":"team","id":"011c95201ed192f7","login":"e83e200c7de9a3ab","name":"Gerard Sans","avatar_url":"https://avatars-next.observableusercontent.com/40c694cf3291ea18caa7142f72fb1896cebaaba1bd76a826e5a3e2762557e93a","tier":"starter_2024","bio":""},"version":542,"publish_version":542,"role":null,"authored":false,"authors":[{"type":"individual","id":"e83e200c7de9a3ab","login":"e83e200c7de9a3ab","name":"Gerard Sans","avatar_url":"https://avatars-next.observableusercontent.com/40c694cf3291ea18caa7142f72fb1896cebaaba1bd76a826e5a3e2762557e93a","tier":null,"bio":""}],"members":[{"type":"individual","id":"e83e200c7de9a3ab","login":"e83e200c7de9a3ab","name":"Gerard Sans","avatar_url":"https://avatars-next.observableusercontent.com/40c694cf3291ea18caa7142f72fb1896cebaaba1bd76a826e5a3e2762557e93a","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"TensorFlow.js LAB01: How to make decisions using weights and a decision matrix","cells":[{"id":0,"value":"# TensorFlow.js LAB01: How to make decisions using weights and a decision matrix\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":304,"value":"## 1) These are the weights to decide which vendor is best\n\nEach weight represents how much you want each attribute to contribute to the final score. \n\nPrice ${parseFloat(r1*100)}% (${r1.toFixed(2)}) + Reputation ${parseFloat(r2*100)}% (${r2.toFixed(2)}) + Sustainability ${parseFloat(r3*100)}% (${r3.toFixed(2)}) = ${Math.round(r1*100+r2*100+r3*100)}% (${(r1+r2+r3).toFixed(2)})\n\n${(r1*100+r2*100+r3*100)!=100?html`Warning: total must add up to 1 [${((r1+r2+r3)-1).toFixed(2)}]`:\"\"}","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":148,"value":"viewof r1 = Inputs.range([0, 1], {label: \"Price\", value: 0.4, step: 0.05});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":155,"value":"viewof r2 = Inputs.range([0, 1], {label: \"Reputation\",value: 0.3, step: 0.05});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":158,"value":"viewof r3 = Inputs.range([0, 1], {label: \"Sustainability\", value: 0.3, step:0.05});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":454,"value":"chart2 = PieChart(pie, {\n name: d => d.name,\n value: d => d.value.toFixed(1),\n width,\n height: 200,\n colors: ['#deebf7','#9ecae1','#3182bd']\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":312,"value":"## 2) Each vendor needs to be scored from 0 to 10 for each weight\n\nIn order to be able to make calculations we need to **normalise** our data. Using scores is a good way to mix different data. Change the **Vendor scores** below to see changes.\n\n- Price: $50 could translate to 10, $80 to 8, +$100 translates to 0. \n- Reputation: # of press releases, website Alexa rank, etc.\n- Sustainability: # of sustainability awards, carbon footprint, etc.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":273,"value":"table = html`\n\n\n\n\n

Vendor scores	A	B	C
price	10	10	8.5
reputation	10	6	9
sustainability	5	10	10

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":321,"value":"## 3) Vendors final score is calculated and sorted from top to bottom","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":119,"value":"chart = Plot.plot({\n color: {\n scheme: \"blues\",\n legend: true,\n },\n x: {\n domain: [0, 10],\n label: \"Score\",\n },\n y: {\n label: \"Vendors\",\n },\n marks: [\n Plot.barX(data, {\n x: \"score\", \n y: \"vendor\", \n fill: \"dimension\",\n sort: {\n y: \"x\", \n reverse: true \n },\n text: \"a\",\n }),\n Plot.text(data_total, {x: \"score\", y: \"vendor\", text: d => (d.score).toFixed(1), dx: 15}),\n Plot.ruleX([0]),\n ],\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":394,"value":"$27","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":257,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":14,"value":"## Notebook setup and dependencies","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":17,"value":"tf = { \n let tf = await require(\"@tensorflow/tfjs@3.20.0/dist/tf.min.js\");\n console.log(tf.version_core);\n return tf;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"vendors = { \n const weights = tf.tensor2d(\n // w1 w2 w3\n [r1, r2, r3], // weights\n [1, 3] // shape (1 row x 3 columns)\n );\n \n const scores = tf.tensor2d(\n [// A B C\n [10, 10, 8.5], // price scores\n [10, 6, 9 ], // reputation scores\n [ 5, 10, 10 ] // sustainability scores\n ], \n [3, 3] // shape (3 rows x 3 columns)\n );\n\n const ratings = tf.matMul(weights, dynamic); // replaced scores by the dynamic version\n \n return { \n tensor: ratings, \n data: ratings.dataSync() \n };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"partial = { \n const weights = tf.tensor2d(\n [[r1, r1, r1], // w1: price\n [r2, r2, r2], // w2: reputation\n [r3, r3, r3]], // w3: sustainability\n [3, 3] // shape (3 row x 3 columns)\n );\n \n const scores = tf.tensor2d(\n [// A B C\n [10, 10, 8.5], // price scores\n [10, 6, 9 ], // reputation scores\n [ 5, 10, 10 ] // sustainability scores\n ], \n [3, 3] // shape (3 rows x 3 columns)\n );\n\n const ratings = tf.mul(weights, dynamic); // replaced scores by the dynamic version\n \n return { \n tensor: ratings, \n data: ratings.dataSync() \n };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":71,"value":"data = [...partial.data].map((v,i) => ({ vendor: [\"A\",\"B\",\"C\"][i%3], score: v, dimension: [\"price\",\"price\",\"price\",\"reputation\",\"reputation\",\"reputation\",\"sustainability\",\"sustainability\",\"sustainability\"][i] }));","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":333,"value":"data_total = [...vendors.data].map((v,i) => ({ vendor: [\"A\",\"B\",\"C\"][i%3], score: v }));","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"Inputs.table(data);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":288,"value":"tableData = Generators.observe(notify => {\n const keyinput = event => notify(parseTableData(table));\n table.addEventListener(\"input\", keyinput);\n notify(parseTableData(table));\n return () => window.removeEventListener(\"input\", keyinput);\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":291,"value":"dynamic = tf.tensor2d(\n tableData.map(v => ([\n parseFloat(v.A), \n parseFloat(v.B), \n parseFloat(v.C)\n ])\n), [3,3])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":285,"value":"function parseTableData(table) {\n const data = [];\n table.querySelectorAll(\"tr\").forEach((row, i)=>{\n data.push(row.innerText.split(/[\\t\\n]/g));\n });\n\n const formattedData = data.reduce((accumulator, row, i)=>{\n if (i==0) {\n accumulator.columns = row;\n } else {\n const rowObject = {};\n accumulator.columns.forEach((key,i)=>{\n rowObject[key] = row[i];\n });\n accumulator.push(rowObject);\n }\n return accumulator;\n },[]);\n \n return formattedData;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":457,"value":"$28","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":463,"value":"pie =[\n {name:'price', value: r1*100},\n {name:'reputation', value: r2*100},\n {name:'sustainability', value: r3*100},\n ]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":526,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W29","stdlib":"1"}} 26:"$25:body"