34:["$","title",null,{"children":"Working with tables Practical 2 | Altai State Univeristy | Observable"}] 3c:[{"id":"ce12fd7933973e0a17e13c7142b3e3d9b299fc3be477cd3e82053021c63a7161db8ebe58c4a2478eb0760c74a35b481cbdc48a7df2d1a40675eaa685c6779c5a","href":"https://static.observableusercontent.com/files/ce12fd7933973e0a17e13c7142b3e3d9b299fc3be477cd3e82053021c63a7161db8ebe58c4a2478eb0760c74a35b481cbdc48a7df2d1a40675eaa685c6779c5a","name":"sport_world(1).csv","type":"text/csv","lastModified":1776666605998.435,"size":15029}] 38:{"id":"48d5380a28bea5ab","slug":"working-with-tables-practical-2","title":"Working with tables Practical 2","thumbnail":"8b0eb27d9660dcd61263dfb5395e1e146f3953164ac0dec5ecd1f78f16a59a77","access_level":"public","create_time":"$D2026-04-20T06:25:58.375Z","update_time":"$D2026-11-09T10:45:12.536Z","view_time":null,"first_public_time":"$D2026-11-09T10:45:17.516Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"9549ceceab8ee23d","login":"altai-state-univeristy","name":"Altai State Univeristy","avatar_url":"https://avatars-next.observableusercontent.com/e02af0746ba2d7f1f4883742136f278b6ad1eb91ea6a98a88da0aa63d98de34a","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":239,"publish_version":239,"role":null,"authored":false,"authors":[{"type":"individual","id":"585cd5e30b187af2","login":"biniam-tesfalem","name":"Biniam Tesfalem","avatar_url":"https://avatars-next.observableusercontent.com/ddaa8ee657058479a4b5aba1328ce1afb4a8845250396b4f4028f8276e47ca83","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"585cd5e30b187af2","login":"biniam-tesfalem","name":"Biniam Tesfalem","avatar_url":"https://avatars-next.observableusercontent.com/ddaa8ee657058479a4b5aba1328ce1afb4a8845250396b4f4028f8276e47ca83","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Working with tables Practical 2","cells":[{"id":0,"value":"# Working with tables Practical 2","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"Import the data from csv file that is sport.csv","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":7,"value":"sport_world_data= FileAttachment(\"sport_world(1).csv\").csv({typed: true})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"Displaying the table which saved on the table","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":9,"value":"viewof table = Inputs.table(sport_world_data)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"sport_world1 = table","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"sport_world1","database":"$undefined"},{"id":26,"value":"# **Display a specific sunset of columns**","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":18,"value":"To display a specific subset of columns, and I change their order. I change the column names. By default, column names are output from data.columns.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":20,"value":"viewof table1 = Inputs.table(sport_world_data, {\n columns: [\n \"Сроки проведения\",\n \"Место проведения\",\n \"Ориентировочное число участников\"\n ],\n header: {\n \"Сроки проведения\": \"Dates_event\",\n \"Место проведения\": \"Location_event\",\n \"Ориентировочное число участников\": \"Estimated_participants\"}, \n sort: \"Место проведения\", reverse:true, required: false})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"**Build new tables**","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":29,"value":"By selecting table rows to build other tables, charts, graphs, etc.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":33,"value":"\n \n \n \n \n \n \n \n \n ${table1.map(d => htl.html`\n \n \n \n `)}\n \n

Dates of the event	Location of the event	Estimated number of participants
${d[\"Сроки проведения\"]}	${d[\"Место проведения\"]}	${d[\"Ориентировочное число участников\"]}

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":50,"value":"Plot.plot({\n marks: [\n Plot.barX(table1, {x: \"Estimated_participants\", y: \"Dates_event\", fill: \"#345678\", sort: {x: \"x\", reverse: true}}),\n Plot.ruleY([0]),\n Plot.ruleX([0, 1500]),\n ], marginLeft: 250\n\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":60,"value":"# Filtering by value range","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":79,"value":"build a list of districts (using Inputs.select)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":81,"value":"Locations = sport_world_data.map(d => d[\"Место проведения\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"viewof select = Inputs.select(\n Locations,\n {\n label: \"Show Location:\"\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"`Selected Locations: ${select}`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":87,"value":"location_data_short = sport_world_data.filter( (x)=> String(x[\"Место проведения\"])==select)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"Inputs.table(location_data_short, \n {\n columns: [\n \"Сроки проведения\",\n \"Место проведения\",\n \"Ориентировочное число участников\"\n ],\n header: {\n \"Сроки проведения\": \"Dates_event\",\n \"Место проведения\": \"Location_event\",\n \"Ориентировочное число участников\": \"Estimated_participants\"\n }, \n \n width: {\n \"Сроки проведения\": 250,\n \"Место проведения\": 100,\n \"Ориентировочное число участников\": 100\n },\n rows: 60, maxWidth: 600, sort: \"Место проведения\", maxHeight: 400, reverse:true, required: false})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":99,"value":"In this part we can show the multiple locations not only one","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":95,"value":"viewof select_mult = Inputs.select(\n Locations, \n {\n label: \"Show Locations:\",\n multiple: true,\n width:300\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":101,"value":"`Selected Locations: ${select_mult.length > 0 ? select_mult.join(', ') : 'No selections'}`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"location_data_multiple = sport_world_data.filter( (x)=> String(x[\"Место проведения\"])==select_mult)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":108,"value":"Inputs.table(location_data_multiple.filter((x)=>select_mult.includes(String(x[\"Место проведения\"]) )),\n {\n columns: [\n \"Сроки проведения\",\n \"Место проведения\",\n \"Ориентировочное число участников\"\n ],\n header: {\n \"Сроки проведения\": \"Dates_event\",\n \"Место проведения\": \"Location_event\",\n \"Ориентировочное число участников\": \"Estimated_participants\"\n }, \n \n width: {\n \"Сроки проведения\": 250,\n \"Место проведения\": 100,\n \"Ориентировочное число участников\": 100\n },\n rows: 60, maxWidth: 600, sort: \"Место проведения\", maxHeight: 400, reverse:true, required: true})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"# Range tool: Inputs.range(options)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":119,"value":"It is necessary to obtain information on the locations of the estimate participant, the population of which (In total for Estimate_participant) is in a certain range.\nGet the boundaries:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":124,"value":"m = sport_world_data.map( (x)=> Number(x[\"Ориентировочное число участников\"])).sort((a,b)=>(a-b))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":126,"value":"function max_min() {\n let minVal = Infinity;\n let maxVal = -Infinity;\n \n for (let x of sport_world_data) {\n const num = Number(x[\"Ориентировочное число участников\"]);\n if (num < minVal) minVal = num;\n if (num > maxVal) maxVal = num;\n }\n \n return [minVal, maxVal];\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":159,"value":"function max_min1() {\n var arr = sport_world_data.map( (x)=> Number(x[\"Ориентировочное число участников\"])).sort((a,b)=>(a-b));\n return [arr[0], arr[arr.length-1]];\n} ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":153,"value":"-this method max_min1() is bad, because creates an array of all values, sorts it, and then retrieves the minimum and maximum values. This method is in efficient b/c sorting the entire array is unnecessary if only need the min and max values - sorting has a higher time complexity(O(n log n)), whereas finding min and max can be done in a single pass (big O(n)) ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":129,"value":"arr_max_min = max_min()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":131,"value":"`Result: Min - ${arr_max_min[0]}, Max - ${arr_max_min[1]}`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":163,"value":"viewof range_A = Inputs.range(\n [arr_max_min[0],arr_max_min[1]], \n {\n label: \"Participant from:\",\n value:arr_max_min[0], \n step: 10, \n width: 400\n }\n)\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":166,"value":"viewof range_B = Inputs.range(\n [range_A, arr_max_min[1]], \n {\n label: \"to:\",\n value: arr_max_min[1],\n step: 10,\n width: 400\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":168,"value":"- This approach bad, b/c introduces unnecessary dependency on array indices, can be confusing to manage and maintain, it may cause errors if the array changes unexpectedly, and doesn't leverage more intuitive, declarative constructs. Use two independent range inputs with explicit min/max bounds.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":186,"value":"### show the number of subjects meeting the condition, using a bar object (canvas) ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":189,"value":"max_count = sport_world_data.length","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":191,"value":"width = 700","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":193,"value":"height = 50","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":195,"value":"viewof count = Inputs.range(\n [0, max_count], \n {\n label: \"Example of work\", \n step: 1, \n width: 250\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":209,"value":"canvas = {\n const context = DOM.context2d(width, height);\n context.fillStyle = \"hsl(216deg 100% 13%)\";\n context.fillRect(0, 0, count*(width/max_count), height);\n context.canvas.style.background = \"hsl(216deg 25% 90%)\";\n return context.canvas;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":211,"value":"display the data in tabular form that satisfies the selected range","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":213,"value":"sport_world_data.columns","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":215,"value":"sportw_data_mult = sport_world_data.filter( \n (x)=> Number(x[\"Ориентировочное число участников\"]) >= range_A && Number(x[\"Ориентировочное число участников\"])<= range_B)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":218,"value":"Inputs.table(sport_world_data.filter(\n (x)=> Number(x[\"Ориентировочное число участников\"]) >= range_A && Number(x[\"Ориентировочное число участников\"])<= range_B), \n {\n columns: [\n \"Наименование соревнования\",\n \"Сроки проведения\",\n \"Место проведения\", \n \"Ориентировочное число участников\"\n ], \n width: {\n \"Район или город\": 250,\n \"Сроки проведения\": 100,\n \"Место проведения\": 120, \n \"Ориентировочное число участников\": 120\n },\n sort: \"Ориентировочное число участников\", maxHeight: 150, maxWidth: 700, reverse:true})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":225,"value":"Plot.plot({\n width:1000,\n marks: [\n Plot.barY(sportw_data_mult, {y: \"Ориентировочное число участников\", x: \"Место проведения\", fill: \"#345678\", sort: {x: \"y\", reverse: true}}),\n Plot.ruleX([0]),\n Plot.ruleY([0, 1500]),\n ], marginLeft: 50\n})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3c","stdlib":"1"}} 33:null