25:["$","title",null,{"children":"Untitled | Vikash Kumar Prasad's Workspace | Observable"}] 49:T785,//drag on the histogram and you can observe the fading of the specific bar in the scatterplot //This vis shows the clustering of various tissues, in combination with their occurence. //User can select any particular tissue for detailed viewing, allows for zooming on panning. { // create an interval selection over an x-axis encoding const brush = vl.selectInterval().encodings('x'); // const isOrigin = vl.selectPoint('isOrigin') // .fields('tissue') // .bind('legend'); // bind to legend interactions // determine opacity based on brush const opacity = vl.opacity().if(brush, vl.value(1.0)).value(0.0); // const show = vl.and(isOrigin); // combine selections // an overview histogram of cars per year // add the interval brush to select cars over time const overview = vl.markBar() .encode( vl.x().fieldO('tissue') // extract year unit, treat as ordinal .axis({title: null, labelAngle: 90}), // no title, no label angle vl.y().count().title(null), // counts, no axis title opacity // modulate bar opacity based on the brush selection ) .params(brush) // add interval brush selection to the chart .width(400) // use the full default chart width .height(200); // set chart height to 50 pixels // a detail scatterplot of horsepower vs. mileage const detail = vl.markPoint() .encode( vl.x().fieldQ('dim0'), vl.y().fieldQ('dim1'), vl.color().fieldN('tissue'), vl.tooltip(['tissue']), vl.size().if(brush, vl.value(100)).value(1000), // vl.color().if(show, vl.color().fieldN('tissue')).value('grey'), opacity // modulate point opacity based on the brush selection ) .params(vl.selectInterval().bind("scales")) .width(700) .height(500) ; // vertically concatenate (vconcat) charts return vl.data(Amsterdam2).vconcat(overview, detail).render(); }4a:T842,class SubPlot extends Plot.Mark { // This function receives the facet information (fx and fy), and returns a new Plot render({ fx, fy }, _scales, _channels, dimensions) { // The charts on the same column must share the same x scale, and the charts on the // same row must share the same y scale (except on the diagonal). Currently this works // because plots are consistent, but it’s not guaranteed if you start playing with // more custom charts. return htl.svg`${Plot.plot({ ...dimensions, insetTop: fx === fy ? 20 : 6, insetBottom: fx === fy ? 0 : 6, inset: 6, axis: null, nice: true, color: color.scale("color"), marks: [ fx === fy ? [ // diagonal cell (one dimension) Plot.auto(data, { x: fx, color: { value: colorBy } }), Plot.text([fx], { frameAnchor: "top", fontWeight: "bold", dy: 5 }) ] : [ // two dimensions Plot.gridX({ ticks: 5 }), Plot.gridY({ ticks: 7 }), Plot.auto(data, { x: fx, y: fy, color: { value: colorBy } }) ], fx === fields[0] && fy !== fx ? [ // left y axes (note that we omit it on the top-left cell, where y is defined by the bar chart) Plot.dotY(data, { y: fy, filter: [] }), // no output, but necessary to set the y scale Plot.axisY({ ticks: 7, label: null, anchor: "left" }) ] : null, fx === fields[fields.length - 1] && fy !== fx ? [ // right y axes Plot.dotY(data, { y: fy, filter: [] }), Plot.axisY({ ticks: 7, label: null, anchor: "right" }) ] : null, fy === fields[fields.length - 1] ? [ // bottom x axes Plot.dotX(data, { x: fx, filter: [] }), Plot.axisX({ ticks: 5, anchor: "bottom", labelAnchor: "center" }) ] : null ] })}`; } }4b:[{"id":"2157f6e205971a5d0dd7854ef66b3ce09b5d70e606034b7c90168b39f314b7a07c0885b16b931d36288643679f62b2217b0ad06550c54674a090eaa39fa53ee7","href":"https://static.observableusercontent.com/files/2157f6e205971a5d0dd7854ef66b3ce09b5d70e606034b7c90168b39f314b7a07c0885b16b931d36288643679f62b2217b0ad06550c54674a090eaa39fa53ee7","name":"scatterplot@2.csv","type":"text/csv","lastModified":1690820160347.496,"size":229353},{"id":"103787000e3a2e80570a7c4f5207cee34673f580104a724c07dc70b630fe96808bcf328e4a2f0d96a3103bb398d290aece3927827c627051f2da01f8685e3c8f","href":"https://static.observableusercontent.com/files/103787000e3a2e80570a7c4f5207cee34673f580104a724c07dc70b630fe96808bcf328e4a2f0d96a3103bb398d290aece3927827c627051f2da01f8685e3c8f","name":"samplePepNan@1.csv","type":"text/csv","lastModified":1691171114625.724,"size":9871160},{"id":"4fc03c04e66f36888ea29b53318363bade06cfc47444be2fa906c1df2312f9ce5674ebd75cfa9a9fbf81910e748aea9964b214d3cd5abc105df8b1271e2193a4","href":"https://static.observableusercontent.com/files/4fc03c04e66f36888ea29b53318363bade06cfc47444be2fa906c1df2312f9ce5674ebd75cfa9a9fbf81910e748aea9964b214d3cd5abc105df8b1271e2193a4","name":"samplePep@5.csv","type":"text/csv","lastModified":1691171106171.672,"size":10193849}] 29:{"id":"9ff228c592e5064b","slug":null,"title":"","thumbnail":null,"access_level":"public","create_time":"$D2023-07-30T17:06:34.024Z","update_time":"$D2023-10-19T00:36:04.996Z","view_time":null,"first_public_time":"$D2023-08-03T14:28:32.478Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"54b2e007772ad81e","login":"vikash-kumar-prasad-ws","name":"Vikash Kumar Prasad's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/de958bd3aad334830977bd640c481429f9af3d171abc9ee2be1b63d0f2ab9440","tier":"starter_2024","bio":"","following":false},"version":986,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"33fb5287a3038d10","login":"vikash-kumar-prasad","name":"Vikash Kumar Prasad","avatar_url":"https://avatars-next.observableusercontent.com/5fa7470b541d481e4017a425056a61d73fb0149383f6aad67acea91183148fe8","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"33fb5287a3038d10","login":"vikash-kumar-prasad","name":"Vikash Kumar Prasad","avatar_url":"https://avatars-next.observableusercontent.com/5fa7470b541d481e4017a425056a61d73fb0149383f6aad67acea91183148fe8","tier":null,"role":"editor"},{"type":"team","id":"54b2e007772ad81e","login":"vikash-kumar-prasad-ws","name":"Vikash Kumar Prasad's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/de958bd3aad334830977bd640c481429f9af3d171abc9ee2be1b63d0f2ab9440","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"","cells":[{"id":18,"value":"Amsterdam2 = d3.csvParse(\n await FileAttachment(\"scatterplot@2.csv\").text(),\n d3.autoType\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"embed = require(\"vega-embed@6\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"import {vl} from '@vega/vega-lite-api-v5'\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":72,"value":"import {fromColumns, printTable} from \"@uwdata/data-utilities\"\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"printTable(Amsterdam2.slice(0, 5))\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"vl.markPoint()\n .data(Amsterdam2)\n .encode(vl.y().field('tissue').type('nominal'))\n .render()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"vl.markBar()\n .data(Amsterdam2)\n .encode(\n vl.y().count('tissue').title('Name of Tissue'),\n vl.x().fieldN('tissue').title(\"Tissue Count In Data\")\n )\n .render()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":919,"value":"

\n \n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":912,"value":"\n\n\nviewof peptide_or_protein = Inputs.select(\n new Map([\n [\"peptides\",Amsterdam2],\n [\"protiens\", Amsterdam2],\n // [\"penguins\", penguins],\n // [\"olympians (10% sample)\", olympians.filter((d, i) => i % 10 === 0)],\n // [\n // FileAttachment(\"seattle-weather.csv\")?.name?.replace(/[.]csv$/, \"\"),\n // FileAttachment(\"seattle-weather.csv\").csv({ typed: true })\n // ],\n // [\"…add your own?\", myData]\n ]),\n { label: \"peptide_or_protein\" }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":917,"value":"\n\n\n\nviewof tissues_or_cancer = Inputs.select(\n new Map([\n [\"tissues\",Amsterdam2],\n [\"cancer\", Amsterdam2],\n // [\"penguins\", penguins],\n // [\"olympians (10% sample)\", olympians.filter((d, i) => i % 10 === 0)],\n // [\n // FileAttachment(\"seattle-weather.csv\")?.name?.replace(/[.]csv$/, \"\"),\n // FileAttachment(\"seattle-weather.csv\").csv({ typed: true })\n // ],\n // [\"…add your own?\", myData]\n ]),\n { label: \"tissues_or_cancer\" }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"//The below plot describes the following:\n//1. The histogram shows the count across the peptides for various tissues\n//2. The below scatterplot shows the dimensionally reduced tissues values across the peptides, as the tissue values were multi variate //across the peptides we dimensionally reduced them to give an overview.\n//3. The plot shows small clusters which are closely related\n//4. Users can select any particular tissue or a group of tissues to examine how well they are closely related.\nvl.markPoint().data(Amsterdam2).encode(\n vl.x().fieldQ('dim0'),\n vl.y().fieldQ('dim1'),\n vl.color().fieldN('tissue'),\n vl.tooltip(['tissue']) // show the Name and Origin fields in a tooltip\n).render()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"$49","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":109,"value":"//Parallel plots\nprintTable(cars.slice(0, 5))\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"peptide_df = d3.csvParse(\n await FileAttachment(\"samplePep@5.csv\").text(),\n d3.autoType\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"printTable(peptide_df.slice(0, 5))\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":128,"value":"import {legend as Legend} from \"@d3/color-legend\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":160,"value":"//interactive heat map\nimport {SummaryTable} from \"@observablehq/summary-table\"\n\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":183,"value":"peptide_df_nan= d3.csvParse(\n await FileAttachment(\"samplePepNan@1.csv\").text(),\n d3.autoType\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":186,"value":"printTable(peptide_df_nan.slice(0, 5))\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":813,"value":"vals ={\n const prostateColumn = peptide_df_nan.map(row => row['Esophagus']);\n var formattedProstateColumn =[];\n for (let i = 0; i < prostateColumn.length; i++) {\n formattedProstateColumn.push({ value: prostateColumn[i] });\n }\n return formattedProstateColumn\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":810,"value":"fn = {\n for(let i=0;i<5;i++){\n vl.markArea()\n .data(vals)\n .transform(\n vl.density('value').bandwidth(0.5).extent([-20, 20])\n )\n .encode(\n vl.x().fieldQ('value').axis({ format: 'd', grid: false }).title(null),\n vl.y().fieldQ('density').axis(null)\n )\n .width(400)\n .height(100)\n .config({ view: { stroke: null }})\n .render()\n }\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":975,"value":"data_summ={\n const data_dict ={};\n for (let i=0;i d[col])\n data_dict[col] = data_sel\n \n }\n\n const result = [];\n const keys = Object.keys(data_dict);\n const numEntries = data_dict[keys[0]].length;\n for (let i = 0; i < numEntries; i++) {\n const entry = {};\n keys.forEach(key => {\n entry[key] = data_dict[key][i];\n });\n result.push(entry);\n }\n return result\n \n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":277,"value":"We provide a summary of the tissue types and cancer types across the peptides. The below table helps the user understand the demography of the peptides; for example, there are 58% missing values in Adrenal Gland indicating that there were no traces of peptides found for 58% of the peptides.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":181,"value":"viewof summary_data = Inputs.select(\n new Map([\n [\"peptides_tissue\",peptide_df_nan],\n [\"peptides_cancer\", peptide_df_nan],\n // [\"penguins\", penguins],\n // [\"olympians (10% sample)\", olympians.filter((d, i) => i % 10 === 0)],\n // [\n // FileAttachment(\"seattle-weather.csv\")?.name?.replace(/[.]csv$/, \"\"),\n // FileAttachment(\"seattle-weather.csv\").csv({ typed: true })\n // ],\n // [\"…add your own?\", myData]\n ]),\n { label: \"summary_table\" }\n)\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":290,"value":"SummaryTable(summary_data)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":293,"value":"// summary_data\nprintTable(peptide_df.slice(0, 10))\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":244,"value":"viewof data = Inputs.select(\n new Map([\n [\"peptides\",peptide_df],\n // [\"cars\", cars],\n // [\"penguins\", penguins],\n // [\"olympians (10% sample)\", olympians.filter((d, i) => i % 10 === 0)],\n // [\n // FileAttachment(\"seattle-weather.csv\")?.name?.replace(/[.]csv$/, \"\"),\n // FileAttachment(\"seattle-weather.csv\").csv({ typed: true })\n // ],\n // [\"…add your own?\", myData]\n ]),\n { label: \"dataset\" }\n)\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":927,"value":"Inputs.checkbox","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":247,"value":"viewof fields = Inputs.checkbox(columns, {\n label: \"fields\",\n value: columns.slice(1, 2 + (document.body.clientWidth / 928) * 4),\n size:2\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":973,"value":"fields","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":249,"value":"viewof colorSel = Inputs.select(columns, { label: \"color\" })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":936,"value":"color","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":251,"value":"legend = color.legend(\"color\", { marginLeft: 60, marginRight: -60, label: colorSel }) || md`_You can add your own dataset to the [**myData**](#my) cell below. Don’t hesitate to fork the notebook and make changes to explore the possibilities!_`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":971,"value":"legend","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":253,"value":"chart = Plot.plot({\n width,\n height: Math.min(780, width),\n marginTop: 20,\n marginLeft: 60,\n marginRight: 70,\n marginBottom: 33,\n facet: { data: cofields, x: \"0\", y: \"1\" },\n fx: { domain: fields },\n fy: { domain: fields },\n axis: null,\n marks: [Plot.frame(), new SubPlot(cofields)]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":255,"value":"// import {PlotMatrix} with {data} from \"@observablehq/autoplot-matrix\"\n\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":257,"value":"PlotMatrix = () => html`${viewof fields}${viewof colorSel}${legend}${chart}`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":259,"value":"$4a","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":261,"value":"columns = (data.columns || Object.keys(data[0])).filter((key) => {\n // filter out fields which can't be useful at all (ordinal with too many values)\n const values = Plot.valueof(data, key);\n for (const p of values)\n if (typeof p === \"string\") return new Set(values).size < 30;\n return true;\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":263,"value":"colorBy = Object.assign(Plot.valueof(data, colorSel), {label: colorSel})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":265,"value":"// This chart, while not super interesting, defines a color scale shared across subplots\n// You can specify options that depend on the selected colorSel field, or let Plot choose the default.\ncolor = Plot.barX(data, Plot.groupZ({ x: \"count\" }, { fill: colorBy })).plot({\n height: 20,\n axis: null,\n color:\n colorSel === \"species\"\n ? { scheme: \"category10\" }\n : colorSel === \"island\"\n ? { scheme: \"buylrd\" }\n : colorSel === \"economy (mpg)\"\n ? { scheme: \"inferno\" }\n : {}\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":267,"value":"cofields = d3.cross(fields, fields)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":316,"value":"printTable(peptide_df.slice(0, 5))\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":337,"value":"total_rows = 20000","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":339,"value":"slicesize = 500","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":341,"value":"startIndex = 0","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":343,"value":"slicedDataFrames = []","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":925,"value":"printTable(peptide_df.slice(0,5))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":345,"value":"js_file={\n const totalRows = 20000;\n const sliceSize = 20;\n var startIndex = 0;\n var slicedDataFrames = [];\n while (startIndex < totalRows) {\n // Calculate the ending index for the current slice\n const endIndex = Math.min(startIndex + sliceSize, totalRows);\n \n // Slice the DataFrame using the current start and end index\n const slicedDataFrame = peptide_df.slice(startIndex, endIndex);\n \n // Add the sliced DataFrame to the array\n slicedDataFrames.push(slicedDataFrame);\n // printTable(slicedDataFrame.length);\n \n // Move the starting index to the next slice\n startIndex = endIndex;\n }\n return slicedDataFrames\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":375,"value":"js_file.length","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":368,"value":"mapper_list ={\n const sliceSize = 20;\n const resultList = [];\n var startIndex = 0;\n for (let i = 0; i < js_file.length;i=i+1) {\n \n const endIndex = startIndex+sliceSize;\n var slicedArray = js_file[i];\n resultList.push([`heat_${startIndex}_${endIndex}`, slicedArray]);\n startIndex = endIndex;\n }\n return resultList\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":517,"value":"math = require('mathjs');","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"\n\nviewof heat_map_data = Inputs.select(\n new Map(mapper_list),////\n { label: \"heatMap\" }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":522,"value":"heat_map_data.slice(0,5)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":413,"value":"d3 = require(\"d3@6\");","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":328,"value":"// printTable(heat_map_data.slice(0,5))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":419,"value":"grid = {\n let values = [];\n for (let row of heat_map_data) { \n let rowValues = [];\n for (let [key, value] of Object.entries(row)) {\n if (key !== \"peptide_name\") {\n rowValues.push(parseFloat(value));\n }\n }\n \n values.push(rowValues);\n }\n return values;\n}\n\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":533,"value":"function euclideanDistance(a, b) {\n let sum = 0;\n for (let i = 0; i < a.length; i++) {\n sum += Math.pow(a[i] - b[i], 2);\n }\n \n return Math.sqrt(sum);\n\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":526,"value":"// Calculate pairwise Euclidean distances\ndist = {\n var distances = [];\n // distances.push([])\n // distances[0].push(\"pep1\",\"pep2\",\"distance\")\n for (let i = 0; i < grid.length; i++) {\n distances.push([]);\n for (let j = 0; j < grid.length; j++) {\n distances[i].push(euclideanDistance(grid[i], grid[j]));\n }\n }\n return distances\n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":870,"value":"\n\n\nviewof thresh = Inputs.select(\n new Map([[\"No Thresh\",\"off\"],\n [\"thresh1\",6],\n [\"thresh2\",7],\n [\"thresh3\",8],\n [\"thresh4\",9],\n [\"thresh5\",10],\n [\"thresh6\",11],\n [\"thresh7\",12],\n [\"thresh8\",13],\n [\"thresh9\",14],\n [\"thresh10\",15],\n [\"thresh11\",16],\n [\"thresh12\",17],\n [\"thresh13\",18],\n [\"thresh14\",19],\n [\"thresh15\",20]]),////\n { label: \"Threshold\" }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":876,"value":"function updateTextBox(value) {\n var textCont = document.getElementById('text-cont');\n textCont.innerHTML = 'Threshold Selected: ' + value;\n }","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":709,"value":"format ={\n \n const peptides = heat_map_data.map((d) => d.peptide_name);\n \n \n const formattedArray = [];\n \n for (let i = 0; i < peptides.length; i++) {\n for (let j = 0; j < peptides.length; j++) {\n if(thresh!=\"off\"){\n if(dist[i][j]>thresh){\n formattedArray.push({\"pep1\":peptides[i], \"pep2\":peptides[j], \"distance\":dist[i][j],\"thresh\":thresh});\n }\n else{\n formattedArray.push({\"pep1\":peptides[i], \"pep2\":peptides[j], \"distance\":0,\"thresh\":thresh})\n }\n }\n else{\n formattedArray.push({\"pep1\":peptides[i], \"pep2\":peptides[j], \"distance\":dist[i][j],\"thresh\":\"off\"})\n }\n }\n }\n\n return formattedArray\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":985,"value":"format","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":905,"value":"updateTextBox(thresh)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":900,"value":"\n\n\n \n\n\n

\n \n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":769,"value":"// spec= {\n\n// document.getElementById(\"vega-container\").innerHTML=\"\";\n// vl.markRect({tooltip: {\"content\": \"data\"}, clip: false})\n// .data(format)\n// .encode(\n// vl.y().fieldO(\"pep1\"),\n// vl.x().fieldO(\"pep2\"),\n// vl.color().average(\"distance\"),\n// // vl.tooltip().field(\"value\"),\n// )\n// .render().then((chart) => {\n// document.getElementById(\"vega-container\").appendChild(chart);\n// });\n// }\nvl.markRect({tooltip: {\"content\": \"data\"}, clip: false})\n .data(format)\n .encode(\n vl.y().fieldO(\"pep1\"),\n vl.x().fieldO(\"pep2\"),\n vl.color().average(\"distance\"),\n // vl.tooltip().field(\"value\"),\n )\n .render()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":939,"value":"data_sample = {\n const data123=[\n {\n \"Name\":\"chevrolet chevelle malibu\",\n \"Miles_per_Gallon\":18,\n \"Cylinders\":8,\n \"Displacement\":307,\n \"Horsepower\":130,\n \"Weight_in_lbs\":3504,\n \"Acceleration\":12,\n \"Year\":\"1970-01-01\",\n \"Origin\":\"USA\"\n },\n {\n \"Name\":\"buick skylark 320\",\n \"Miles_per_Gallon\":15,\n \"Cylinders\":8,\n \"Displacement\":350,\n \"Horsepower\":165,\n \"Weight_in_lbs\":3693,\n \"Acceleration\":11.5,\n \"Year\":\"1970-01-01\",\n \"Origin\":\"USA\"\n },\n {\n \"Name\":\"plymouth satellite\",\n \"Miles_per_Gallon\":18,\n \"Cylinders\":8,\n \"Displacement\":318,\n \"Horsepower\":150,\n \"Weight_in_lbs\":3436,\n \"Acceleration\":11,\n \"Year\":\"1970-01-01\",\n \"Origin\":\"USA\"\n }\n ]\n return data123\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":969,"value":"{\n \"$schema\": \"https://vega.github.io/schema/vega-lite/v4.json\",\n \"data\": {\"url\": \"https://vega.github.io/vega-datasets/data/cars.json\"},\n \"repeat\": {\n \"row\": [\"Horsepower\", \"Miles_per_Gallon\", \"Acceleration\"],\n \"column\": [\"Horsepower\", \"Miles_per_Gallon\", \"Acceleration\"]\n },\n \"spec\": {\n \"mark\": {\"type\": \"circle\", \"point\": {\"filled\": false, \"fill\": \"black\"},\"tooltip\":true},\n \"encoding\": {\n \"x\": {\"field\": {\"repeat\": \"row\"}, \"type\": \"quantitative\"},\n \"y\": {\"field\": {\"repeat\": \"column\"}, \"type\": \"quantitative\"},\n \"color\": {\"field\": \"Horsepower\", \"type\": \"quantitative\"}\n }\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":947,"value":"vl.markCircle()\n .data(data_sample)\n .encode(\n \n vl.tooltip().fieldN(\"Name\"),\n \n vl.color().field(\"Horsepower\").type(\"quantitative\"),\n // vl.fill().value(\"orangered\")\n // vl.color().field(\"Horsepower\").type(\"quantitative\").value(\"black\")\n )\n .repeat({ row: [\"Horsepower\", \"Miles_per_Gallon\", \"Acceleration\"], column: [\"Horsepower\", \"Miles_per_Gallon\", \"Acceleration\"] })\n .render() ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":941,"value":"vl.color()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4b","stdlib":"1"}} 24:null