25:null 26:["$","title",null,{"children":"Andromeda_JS | Han Liu | Observable"}] 2b:T55c,viewof w = { var form = html``; // nonlinear slider to weight mappings: function weightOfSlider(s){ return s < 1 ? s : (s-1)*(data.attrs.length-1)+1; } function sliderOfWeight(w){ return w < 1 ? w : (w-1)/(data.attrs.length-1)+1; } // initialize weights to 1.0: //console.log("weights>>>", weights) //mutable weights = Object.fromEntries(data.attrs.map(a => [a, 1.0])); form.value = weights; // if (weights.length === 0) { // mutable weights = Object.fromEntries(data.attrs.map(a => [a, 1.0])); // } // else{ // mutable weights = labeled_weights // } // slider interaction: data.attrs.forEach(attr => form[attr].oninput = () => { weights[attr] = weightOfSlider(form[attr].valueAsNumber); const remaining = data.attrs.length - weights[attr]; const prev = d3.sum(data.attrs.map(a => weights[a])) - weights[attr]; if (prev == 0) data.attrs.forEach(a => { if (a != attr) form[a].value = sliderOfWeight(weights[a] = remaining / (data.attrs.length-1)) }); else data.attrs.forEach(a => { if (a != attr) form[a].value = sliderOfWeight(weights[a] = weights[a] * remaining / prev) }); form.value = weights; } ); return form; }2c:Ta3c,scatter_chart = { const start = Date.now() const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height]); const labels = svg.append("g") .attr('class', 'labels') .selectAll("text").data(graph.vertices).join("text") .text(d => d.id) .attr("dx", 8).attr("dy", ".35em") .attr('id', (d, i) => {return "text_" + i}) .style('display', (d,i) => { if(relevance_inPercent[i] < relevance[0] * 100 || relevance_inPercent[i] > relevance[1] * 100){ simulation.restart(); return "none"; }else{ simulation.restart(); return ""; } }) .call(drag(simulation)); var select = [] const nodes = svg.append("g") .attr('class', 'nodes') .selectAll("circle").data(graph.vertices).join("circle") .attr("r", 7) .attr('id', (d, i) => {return "circle_" + i}) .attr('class', "circle") .style('display', (d,i) => { if(relevance_inPercent[i] < relevance[0] * 100 || relevance_inPercent[i] > relevance[1] * 100){ simulation.restart(); return "none"; }else{ simulation.restart(); return ""; } }) .on("click", (event, d) => { var selectedID = d3.select(event.target).attr("id").split("_")[1]; var lineID = "#line_" + selectedID; select.push(labels._groups[0][Number(selectedID)]) mutable selected_nodes = select if(d3.select(event.target).style("fill") == "blue"){ d3.select(event.target).style('fill', (d, i) => cScale(relevance_inPercent[d.index])); d3.select(lineID).style('stroke', (d, i) => cScale(relevance_inPercent[d.index])); d3.select(lineID).attr('stroke-width', 1.5); }else{ d3.select(lineID).style('stroke', "blue"); d3.select(lineID).attr('stroke-width', 5); d3.select(event.target).style('fill', "blue"); } }) .style('fill', (d,i) => cScale(relevance_inPercent[i])) .call(drag(simulation)); // nodes.append("title") // .text((d, i) => {return "Relevance score: " + relevance_inPercent[i].toFixed(2);}); let num_sim = 0; simulation.on("tick", () => { nodes.attr("cx", d => d.x).attr("cy", d => d.y); labels.attr("x", d => d.x).attr("y", d => d.y); console.log("simulation time: ", Date.now()); num_sim += 1; }); invalidation.then(() => simulation.stop()); const end = Date.now() console.log("graph render time diff: ", end, start, end-start) return svg.node(); }2d:Tf63,// Copyright 2021 Observable, Inc. // Released under the ISC license. // https://observablehq.com/@d3/horizontal-bar-chart function BarChart(data, { x = d => d, // given d in data, returns the (quantitative) x-value y = (d, i) => i, // given d in data, returns the (ordinal) y-value title, // given d in data, returns the title text marginTop = 30, // the top margin, in pixels marginRight = 0, // the right margin, in pixels marginBottom = 10, // the bottom margin, in pixels marginLeft = 80, // the left margin, in pixels width = 640, // the outer width of the chart, in pixels height, // outer height, in pixels xType = d3.scaleLinear, // type of x-scale xDomain, // [xmin, xmax] xRange = [marginLeft, width - marginRight], // [left, right] xFormat, // a format specifier string for the x-axis xLabel, // a label for the x-axis yPadding = 0.1, // amount of y-range to reserve to separate bars yDomain, // an array of (ordinal) y-values yRange, // [top, bottom] color = "currentColor", // bar fill color titleColor = "white", // title fill color when atop bar titleAltColor = "currentColor", // title fill color when atop background } = {}) { // Compute values. const X = d3.map(data, x); const Y = d3.map(data, y); // Compute default domains, and unique the y-domain. if (xDomain === undefined) xDomain = [0, d3.max(X)]; if (yDomain === undefined) yDomain = Y; yDomain = new d3.InternSet(yDomain); // Omit any data not present in the y-domain. const I = d3.range(X.length).filter(i => yDomain.has(Y[i])); // Compute the default height. if (height === undefined) height = Math.ceil((yDomain.size + yPadding) * 25) + marginTop + marginBottom; if (yRange === undefined) yRange = [marginTop, height - marginBottom]; // Construct scales and axes. const xScale = xType(xDomain, xRange); const yScale = d3.scaleBand(yDomain, yRange).padding(yPadding); const xAxis = d3.axisTop(xScale).ticks(width / 80, xFormat); const yAxis = d3.axisLeft(yScale).tickSizeOuter(0); // Compute titles. if (title === undefined) { const formatValue = xScale.tickFormat(100, xFormat); title = i => `${formatValue(X[i])}`; } else { const O = d3.map(data, d => d); const T = title; title = i => T(O[i], i, data); } const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .attr("style", "max-width: 100%; height: auto; height: intrinsic;"); svg.append("g") .attr("transform", `translate(0,${marginTop})`) .call(xAxis) .call(g => g.select(".domain").remove()) .call(g => g.selectAll(".tick line").clone() .attr("y2", height - marginTop - marginBottom) .attr("stroke-opacity", 0.1)) .call(g => g.append("text") .attr("x", width - marginRight) .attr("y", -22) .attr("fill", "currentColor") .attr("text-anchor", "end") .text(xLabel)); svg.append("g") .attr("fill", color) .selectAll("rect") .data(I) .join("rect") .attr("x", xScale(0)) .attr("y", i => yScale(Y[i])) .attr("width", i => xScale(X[i]) - xScale(0)) .attr("height", yScale.bandwidth()); svg.append("g") .attr("fill", titleColor) .attr("text-anchor", "end") .attr("font-family", "sans-serif") .attr("font-size", 10) .selectAll("text") .data(I) .join("text") .attr("x", i => xScale(X[i])) .attr("y", i => yScale(Y[i]) + yScale.bandwidth() / 2) .attr("dy", "0.35em") .attr("dx", -4) .text(title) .call(text => text.filter(i => xScale(X[i]) - xScale(0) < 20) // short bars .attr("dx", +4) .attr("fill", titleAltColor) .attr("text-anchor", "start")); svg.append("g") .attr("transform", `translate(${marginLeft},0)`) .call(yAxis); return svg.node(); }2e:T7ac,function inversMDS(dataHDpart, data2Dnew){ const start = Date.now() //console.log(">>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>") let MAX = 500; let col = dataHDpart[0].length; let row = dataHDpart.length; let curWeights = Array(col).fill(1/col); let newWeights = Array(col).fill(1/col); let flag = Array(col).fill(0); let direction = Array(col).fill(1); let step = Array(col).fill(1/col); let dataHDw = apply_weights(dataHDpart, curWeights); let distHD = pairwise_distance(dataHDw, "manhattan"); let curStress = stress(distHD, dist2D); //console.log("cur_stress: " + curStress) for(let i = 0; i < MAX; ++i){ for (let dim = 0; dim < col; dim++) { let nw = new_proposal(curWeights[dim], step[dim], direction[dim]); //console.log(nw) let s = 1 + nw - curWeights[dim] for (let index = 0; index < curWeights.length; index++) { let temp = curWeights[index]/s; newWeights[index] = curWeights[index]/s; } newWeights[dim] = nw/s; dataHDw = apply_weights(dataHDpart, newWeights); distHD = pairwise_distance(dataHDw, "manhattan"); let newStress = stress(distHD, dist2D); //console.log('newstress: '+ newStress + " curstress: "+curStress) if (newStress < curStress){ let temp = curWeights; curWeights = newWeights; newWeights = temp; curStress = newStress; flag[dim] = flag[dim] + 1; } else { flag[dim] = flag[dim] - 1; direction[dim] = -direction[dim]; } if (flag[dim] >= 5){ step[dim] = step[dim] * 2; flag[dim] = 0; } else if (flag[dim] <= -5) { step[dim] = step[dim] / 2; flag[dim] = 0; } } } const end = Date.now(); console.log("inverse mds speed: ", end-start) console.log("final stress: " + curStress) return curWeights; }2f:[{"id":"45a9ebcc28d86912f7044e2a2632374ff4d9df471c2d885f3abb4edcda7e3fc654a3367ec78ac8bcd7ebb6d523476e4b11d077cbaeaa93af45159a4bbe85b7af","href":"https://static.observableusercontent.com/files/45a9ebcc28d86912f7044e2a2632374ff4d9df471c2d885f3abb4edcda7e3fc654a3367ec78ac8bcd7ebb6d523476e4b11d077cbaeaa93af45159a4bbe85b7af","name":"Animal_Data_Andromeda@1.csv","type":"text/csv","lastModified":1653499815951.873,"size":9434}] 29:{"id":"4b38a438adb50b4f","slug":"andromeda_js/2","title":"Andromeda_JS","thumbnail":"9c64ff6bae807e8630c5045ae6878564e62c43652f9764efdb11c801ef54fca8","access_level":"public","create_time":"$D2022-05-25T17:30:15.951Z","update_time":"$D2023-04-26T06:49:33.897Z","view_time":null,"first_public_time":"$D2022-05-25T19:58:41.273Z","fork":{"id":"608c4d9f5ec94516","slug":"andromeda_js","title":"O-Andromeda","owner":{"id":"8a3d31b303288012","login":"hanliuxxx","name":"Han Liu"}},"stars":2,"starred":false,"owner":{"type":"team","id":"8a3d31b303288012","login":"hanliuxxx","name":"Han Liu","avatar_url":"https://avatars-next.observableusercontent.com/0906f84ce04affad59cdc3dbedb67befde3c0a9ca1cfdaa73fa2b4323861a1ce","tier":"starter_2024"},"version":2198,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"08550ca7155b8f2a","login":"hanliuxxx","name":"Han Liu","avatar_url":"https://avatars-next.observableusercontent.com/0906f84ce04affad59cdc3dbedb67befde3c0a9ca1cfdaa73fa2b4323861a1ce","tier":null}],"members":[{"type":"individual","id":"08550ca7155b8f2a","login":"hanliuxxx","name":"Han Liu","avatar_url":"https://avatars-next.observableusercontent.com/0906f84ce04affad59cdc3dbedb67befde3c0a9ca1cfdaa73fa2b4323861a1ce","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":9,"collection":null,"type":"notebook","body":{"title":"Andromeda_JS","cells":[{"id":0,"value":"md`# Andromeda_JS`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":616,"value":"viewof relevance = rangeSlider({\n min: 0,\n max: 1,\n // Note that values must be specified as array of length 2.\n value: this ? this.value : [0, 1],\n // Custom slider CSS, replaces all styles.\n theme: themes['Flat'],\n // Overrides the range color. Support for range colors is up to the theme.\n color: '#3b99fc',\n format: '.0%',\n description: '0%: less relevant; 100%: most relevant;',\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":809,"value":"legend({\n color: cScale,\n title: \"Relevance\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":765,"value":"md `Rescale the visualization`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":941,"value":"$2b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1933,"value":"viewof scale = {\n var form = html``;\n form.oninput = () => form.value = form.scale.valueAsNumber;\n form.value = 10;\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"$2c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1712,"value":"viewof reset_button = Inputs.button(\"Reset Plot\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1628,"value":"viewof copy2sliders = Inputs.button([\n [\"copy to Sliders\", value =>value += 1]\n], {value: 0})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1445,"value":"inversed_chart = BarChart(labeled_weights, {\n x: d => d.Weight,\n y: d => d.Name,\n yDomain: d3.groupSort(labeled_weights, ([d]) => -d.Weight, d => d.Name), // sort by descending frequency\n xFormat: \"%\",\n xLabel: \"Frequency →\",\n width,\n color: \"steelblue\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1556,"value":"$2d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1924,"value":"mutable counter = 0","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1829,"value":"copy_to_sliders = {\n copy2sliders;\n var result = {}\n \n //console.log(selected_nodes.length, copy2sliders)\n if (selected_nodes.length >= 2 && copy2sliders !== counter) {\n for (let i = 0; i < attrs.length; i++) {\n result[attrs[i]] = updated_weights[i];\n }\n console.log(\"result>>\",result)\n\n mutable counter = copy2sliders\n mutable weights = result\n }\n return result\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"md `## Data Preprocessing for Relevance Data`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1720,"value":"mutable weights = Object.fromEntries(data.attrs.map(a => [a, 1.0]));","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":107,"value":"weight_list = {\n var lst = [];\n for(var i = 0; i < attrs.length;i++) {\n //console.log(attrs[i], w[attrs[i]])\n lst.push(w[attrs[i]]/attrs.length);\n }\n return lst;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"attrs = Object.keys(new_data[0])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"names = data.map(r => r.Name)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":101,"value":"new_data = data.map(r => {\n var obj = Object.assign({}, r);\n delete obj.Name;\n return obj;\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":99,"value":"normalized_data = {\n var stdMean = []\n for(var i = 0; i < attrs.length; i++){\n var obj = {};\n var arr = new_data.map(r=>r[attrs[i]]);\n obj['std_dev'] = d3.deviation(arr);\n obj['mean'] = d3.deviation(arr);\n stdMean.push(obj);\n }\n \n return new_data.map(r => {\n var norm = Object.assign({}, r);\n for(var i = 0; i < attrs.length; i++) {\n norm[attrs[i]] = (norm[attrs[i]] - stdMean[i][\"mean\"]) / stdMean[i][\"std_dev\"];\n }\n return norm;\n })\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"applied_weight_data = {\n return normalized_data.map(r => {\n for (var i = 0; i < attrs.length; i++){\n r[attrs[i]] *= weight_list[i];\n }\n return r;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"relv_value = {\n var relv_list = []\n applied_weight_data.map(r => {\n var maxx = 0;\n for (var i =0; i < attrs.length; i++) {\n maxx += r[attrs[i]]\n }\n relv_list.push(maxx);\n })\n return relv_list;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":291,"value":"relevance_inPercent = {\n var rele_percentage = [];\n var minValue = Math.min(...relv_value);\n var maxValue = Math.max(...relv_value);\n for (var i =0; i < relv_value.length; i++) {\n rele_percentage.push(((relv_value[i] - minValue) / (maxValue - minValue)) * 100);\n }\n return rele_percentage;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"md `## Color-Coded Scatter Plot Initialization`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":787,"value":"md`1. Build Color Scale for the dots\n2. Create the simulation for the forced-directed graph\n3. Initialize data to be a suitable format\n4. Build the forced-directed graph based on L1 distance\n4. Enable the drag functionality`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":366,"value":"cScale = d3.scaleSqrt([0, 50, 100], [\"yellow\", \"red\", \"darkred\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"{\n data.weights = w;\n graph.edges.forEach( (e, i) => {\n e.mydistance = Distance(e.source.row, e.target.row)} );\n simulation.force(\"link\")\n .distance(e => e.mydistance * scale * 0.8);\n simulation.alpha(1).restart();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"simulation = d3.forceSimulation(graph.vertices)\n .force(\"link\", d3.forceLink(graph.edges)\n .distance(e => e.mydistance * 20)\n \t\t.strength(e => 10.0 / e.distance) \n \t\t.strength(0.5) \n )\n .force(\"charge\", d3.forceManyBody())\n .force(\"center\", d3.forceCenter(width / 2, height / 2));","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"data = {\n reset_button;\n var data = d3.csvParse(await FileAttachment(\"Animal_Data_Andromeda@1.csv\").text(), d3.autoType);\n data.attrs = data.columns.slice(1); // the quantitative attributes in the data table\n data.label = data.columns[0]; // the column to use for the dot labels\n data.stdevs = {}; // zscore normalization factors for each attribute, for Distance()\n data.attrs.forEach(a => data.stdevs[a] = d3.deviation(data, r => r[a])); \n data.weights = {}; \n data.attrs.forEach(a => data.weights[a] = 1.0); \n return data;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"// Distance metric, computes normalized high-dimensional distance between 2 rows in the data table.\n// r1, r2 = references to data table rows.\nfunction Distance(r1, r2) {\n\treturn d3.sum(data.attrs.map(attr =>\n\t\t\tMath.abs(r1[attr] - r2[attr]) / data.stdevs[attr] * data.weights[attr] )); // weighted L1\n //return d3.sum(data.attrs.map(attr =>\n\t//\t\tMath.abs(r1[attr] - r2[attr]) / data.stdevs[attr] )); // L1\n //return Math.sqrt(d3.sum(data.attrs.map(attr =>\n\t//\t\tMath.pow((r1[attr] - r2[attr])/data.stdevs[attr], 2)))); // L2\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"graph = {\n reset_button;\n copy2sliders;\n var vertices = data.map( (r,i) => ({'id':r[data.label], 'index':i, 'row':r}) );\n var edges = []; // completely connected graph\n vertices.forEach( (src, isrc) => \n vertices.forEach( (dst, idst) => {\n if(isrc < idst) \n edges.push( {'source':src, 'target':dst, 'mydistance':Distance(src.row, dst.row)} ); } ) );\n return {'vertices':vertices, 'edges':edges};\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"drag = simulation => {\n function dragstarted(event) {\n if (!event.active) simulation.alphaTarget(0.3).restart();\n event.subject.fx = event.subject.x;\n event.subject.fy = event.subject.y;\n }\n function dragged(event) {\n event.subject.fx = event.x;\n event.subject.fy = event.y;\n //console.log(Date.now())\n }\n /*function dragended(event) {\n if (!event.active) simulation.alphaTarget(0);\n event.subject.fx = null;\n event.subject.fy = null;\n }*/\n return d3.drag()\n .on(\"start\", dragstarted)\n .on(\"drag\", dragged)\n // .on(\"end\", dragended);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"height = 700","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1533,"value":"scale_x = d3.scaleLinear()\n .domain([0, width]) // unit: km\n .range([-30, 30]) // unit: pixels","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1537,"value":"scale_y = d3.scaleLinear()\n .domain([0, height]) // unit: km\n .range([30, -30]) // unit: pixels","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":991,"value":"md`# Inverse MDS`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1155,"value":"md `## Retrieve Selected Data`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1004,"value":"mutable selected_nodes = {\n reset_button;\n return []\n}\n// add keyword to selected_nodes so that it can be automatically refreshed","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1571,"value":"selected_data","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1030,"value":"selected_data = {\n let result = [];\n \n for (let i=0; i < selected_nodes.length; ++i) {\n let svg = selected_nodes[i][\"__data__\"]\n let index = svg[\"index\"];\n //result.push(index)\n result.push(data[index]);\n }\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1563,"value":"selected_labels = {\n let result = [];\n \n for (let i=0; i < selected_data.length; ++i) {\n let x = selected_data[i]['Name'];\n result.push(x);\n }\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1483,"value":"FileAttachment(\"Animal_Data_Andromeda@1.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1108,"value":"selected_cords = {\n let result = [];\n \n for (let i=0; i < selected_nodes.length; ++i) {\n let x = Object.values(selected_nodes[i])[0]['x'];\n x = scale_x(x)\n let y = Object.values(selected_nodes[i])[0]['y'];\n y = scale_y(y)\n result.push([x, y]);\n }\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1295,"value":"md `## Distance Functions`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1177,"value":"function euclidean_distance(a, b) {\n if (a != null && b != null) {\n if (a.length == b.length) {\n let result = 0\n for (let i = 0; i < a.length; i++) {\n let diff = a[i] - b[i]\n let square = diff**2\n result += square\n }\n return Math.sqrt(result)\n }\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1279,"value":"//manhattan_distance([2,2], [1,8])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1275,"value":"function manhattan_distance (a, b) {\n if (a != null && b != null) {\n if (a.length == b.length ) {\n let result = 0\n for (let i = 0; i < a.length; i++) {\n let diff = a[i] - b[i]\n let absolute = Math.abs(diff)\n result += absolute\n }\n return result\n }\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1157,"value":"function pairwise_distance(dataset, distance_function) {\n if (selected_cords.length >= 2) {\n let row_index = selected_cords.length\n let col_index = selected_cords[0].length\n let result = []\n for (let i = 0; i < row_index; ++i){\n let row = []\n for (let j = 0; j < row_index; ++j) {\n let distance = 0\n if (distance_function == \"euclidean\"){\n distance = euclidean_distance(dataset[i], dataset[j])\n }\n else if (distance_function == \"manhattan\"){\n distance = manhattan_distance(dataset[i], dataset[j])\n }\n row.push(distance)\n \n }\n result.push(row)\n }\n return result\n }\n else {\n return []\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1014,"value":"md`## Data Preparation`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1298,"value":"dataHDpart = {\n let result = []\n for (let i = 0; i < selected_data.length; i++) {\n let row = Object.values(selected_data[i]).slice(1)\n result.push(row)\n }\n return result\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1301,"value":"data2Dnew = {\n return selected_cords\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1220,"value":"md `### Proposal`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":993,"value":"//1. proposal function\nfunction new_proposal(current, step, direction) {\n //console.log(current, step, direction)\n let move = current + direction*step*Math.random()\n if(move > 0.9999){\n move = 0.9999\n }\n else if (move < 0.00001){\n move = 0.00001\n }\n return move\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1222,"value":"md `### Stress`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1025,"value":"//2. stress function\nfunction stress(distHD, dist2D) {\n let diff_sum = 0\n let total_sum = 0\n for (let i = 0; i < distHD.length; i++){\n for (let j = 0; j < distHD[0].length; j++){\n let x = distHD[i][j]\n let y = dist2D[i][j]\n diff_sum += (x-y)**2\n total_sum += x**2\n }\n }\n return diff_sum/total_sum\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1229,"value":"//x = [[0, 25, 31.88], [25, 0, 16.28], [31.88, 16.28, 0]]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1230,"value":"//y = [[0,2.3,5], [2.31,0,2.76], [5.04, 2.76, 0]]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1150,"value":"//stress(x, y)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1246,"value":"md `### Inverse MDS`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1321,"value":"dist2D = pairwise_distance(data2Dnew, \"euclidean\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1345,"value":"//testing_data = [[1,2], [3,4]]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1349,"value":"//testing_weights = [1, 0.5]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1336,"value":"function apply_weights(data, weights){\n let result = []\n for (let i = 0; i < data.length; i++) {\n let row = []\n for (let j = 0; j < weights.length; j++) {\n row.push(data[i][j]*weights[j])\n }\n result.push(row)\n }\n return result\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1027,"value":"$2e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1433,"value":"updated_weights = {\n var result = []\n \n if (selected_cords.length >= 2) {\n result = inversMDS(dataHDpart, data2Dnew)\n }\n var sum = result.reduce((a, b) => a + b, 0)\n for (var i = 0; i < result.length; i++){\n result[i] = result[i]*36/sum\n }\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1477,"value":"labeled_weights = {\n var result = []\n \n for (let i = 0; i < attrs.length; i++) {\n result[i] = {\"Name\": attrs[i], \"Weight\": updated_weights[i]}\n }\n return result\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":320,"value":"md`## Import`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"import {legend} from '@d3/color-legend'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":265,"value":"import {rangeSlider, themes} from '@mootari/range-slider'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"html`\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"md` \n## Reference\n1. https://observablehq.com/d/72afa1ae13806e66\n2. https://observablehq.com/@d3/parallel-coordinates\n3. https://observablehq.com/@mootari/range-slider\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1488,"value":"FileAttachment(\"Animal_Data_Andromeda@1.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W2f","stdlib":"1","titling":"auto"}} 2a:"$29:body"