2c:null 2d:["$","title",null,{"children":"Задание для Практической работы 2 | Тимур Ерофеев | Observable"}] 32:[{"id":"a0f0f9469cb01b537599e31489bba2f73f3f2ed0f2bb294b3b306b9f32789a532919d2a25dcafe2674e9d66c18cc4a714c96fcc14b08e76b4fd4bc6a2e711550","href":"https://static.observableusercontent.com/files/a0f0f9469cb01b537599e31489bba2f73f3f2ed0f2bb294b3b306b9f32789a532919d2a25dcafe2674e9d66c18cc4a714c96fcc14b08e76b4fd4bc6a2e711550","name":"sport_world.csv","type":"text/csv","lastModified":1789809316495,"size":15029}] 30:{"id":"e1b973a653619b8a","slug":"zadanie-dlya-prakticheskoy-raboty-2","title":"Задание для Практической работы 2","thumbnail":"948a4087ccba179cff9867d9bd21c9793496474efe8033bd002fc9ccf2b08ad9","access_level":"public","create_time":"$D2026-09-19T09:34:38.669Z","update_time":"$D2026-10-04T09:15:36.373Z","view_time":null,"first_public_time":"$D2026-10-04T09:09:30.820Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"a7c9d2344f5ac89b","login":"timurikfdfdfd","name":"Тимур Ерофеев","avatar_url":"https://avatars-next.observableusercontent.com/be43f33b3e97b924975f02596e535c2c4f75c0304eb7a8eb7cedcf6a013cbffc","tier":"free_2026"},"version":117,"publish_version":117,"role":null,"authored":false,"authors":[{"type":"individual","id":"372f3670d7d22ab2","login":"timurikfdfdfd","name":"Тимур Ерофеев","avatar_url":"https://avatars-next.observableusercontent.com/be43f33b3e97b924975f02596e535c2c4f75c0304eb7a8eb7cedcf6a013cbffc","tier":null}],"members":[{"type":"team","id":"a7c9d2344f5ac89b","login":"timurikfdfdfd","name":"Тимур Ерофеев","avatar_url":"https://avatars-next.observableusercontent.com/be43f33b3e97b924975f02596e535c2c4f75c0304eb7a8eb7cedcf6a013cbffc","tier":"free_2026","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Задание для Практической работы 2","cells":[{"id":1,"value":"# Задание для Практической работы 2\n\nДанные для экспериментов: sport_world.scv. Показать умения работать с табличными данными (Java-Table, Html-Table): новые названия, порядок, ширина столбцов, начальная сортировка строк;\n\n- построение по выбранным (вручную) строкам самой простой диаграммы;\n- построение фильтров для табличных данных на основе инструментов: select (multy), text, range;\n- сделать ВСЕ задания !!!! (указаны в notebook-е).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"## Исходная таблица","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"const sport_world = FileAttachment(\"sport_world.csv\").csv({typed: true})","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"Inputs.table(sport_world)","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"\"Всего записей в таблице:\"+`${sport_world.length}`","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"## Переименование столбцов, изменение порядка, ширины, сортировки","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"\nInputs.table(sport_world, {\n columns: [\n \"Наименование соревнования\",\n \"номер\",\n \"Сроки проведения\",\n \"Место проведения\",\n \"Ориентировочное число участников\"\n ],\n header: {\n \"номер\": \"№\",\n \"Наименование соревнования\": \"Соревнование\",\n \"Сроки проведения\": \"Период\",\n \"Место проведения\": \"Город\",\n \"Ориентировочное число участников\": \"Участников\"\n },\n width: {\n \"номер\": 50,\n \"Наименование соревнования\": 400,\n \"Сроки проведения\": 120,\n \"Место проведения\": 150,\n \"Ориентировочное число участников\": 100\n },\n sort: \"Ориентировочное число участников\",\n reverse: true,\n rows: 20\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"const selectedRows = view(Inputs.table(sport_world, {\n columns: [\"номер\", \"Наименование соревнования\", \"Ориентировочное число участников\"],\n header: {\n \"номер\": \"№\",\n \"Наименование соревнования\": \"Соревнование\",\n \"Ориентировочное число участников\": \"Участников\"\n },\n width: {\n \"номер\": 50,\n \"Наименование соревнования\": 350,\n \"Ориентировочное число участников\": 100\n },\n rows: 15\n}));","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"\nPlot.plot({\n title: \"Количество участников по выбранным соревнованиям\",\n width: 800,\n height: 400,\n marginLeft: 300,\n x: {\n label: \"Количество участников\",\n grid: true\n },\n y: {\n label: null\n },\n marks: [\n Plot.barX(selectedRows, {\n x: \"Ориентировочное число участников\",\n y: \"Наименование соревнования\",\n fill: \"steelblue\",\n sort: { y: \"x\", reverse: true }\n }),\n Plot.text(selectedRows, {\n x: \"Ориентировочное число участников\",\n y: \"Наименование соревнования\",\n text: d => d[\"Ориентировочное число участников\"],\n dx: 5,\n textAnchor: \"start\"\n })\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"## Настройка фильтров для данных","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"viewof selectedMonths = Inputs.select(\n [...new Set(sport_world.map(d => d[\"Сроки проведения\"]))],\n {\n multiple: true,\n label: \"Выберите месяцы:\",\n size: 6\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"viewof searchText = Inputs.text({\n label: \"Поиск по названию:\",\n placeholder: \"Введите текст...\",\n value: \"\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"viewof minParticipants = Inputs.range(\n [0, 1500],\n {\n step: 10,\n value: 0,\n label: \"Минимум участников:\"\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"filteredData = sport_world\n .filter(d =>\n selectedMonths.length === 0 ||\n selectedMonths.includes(d[\"Сроки проведения\"])\n )\n .filter(d =>\n searchText === \"\" ||\n d[\"Наименование соревнования\"]\n .toLowerCase()\n .includes(searchText.toLowerCase())\n )\n .filter(d =>\n d[\"Ориентировочное число участников\"] >= minParticipants\n )","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"Inputs.table(filteredData, {\n columns: [\n \"номер\",\n \"Наименование соревнования\",\n \"Сроки проведения\",\n \"Место проведения\",\n \"Ориентировочное число участников\"\n ],\n header: {\n \"номер\": \"№\",\n \"Наименование соревнования\": \"Соревнование\",\n \"Сроки проведения\": \"Период\",\n \"Место проведения\": \"Город\",\n \"Ориентировочное число участников\": \"Участников\"\n },\n sort: \"Ориентировочное число участников\",\n reverse: true,\n rows: 15\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"const total = filteredData.length;\nconst totalParticipants = d3.sum(filteredData, d => d[\"Ориентировочное число участников\"]);\nconst avgParticipants = total > 0 ? Math.round(totalParticipants / total) : 0;\n\ndisplay(html`

\n Сводка по текущему фильтру:
\n Соревнований: ${total}
\n Общее число участников: ${totalParticipants.toLocaleString(\"ru-RU\")}
\n Среднее число участников: ${avgParticipants}\n

`);","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"## Заднания из блокнота примера","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"В блокноте с примером используется map + sort для поиска минимума и максимума. Это плохо, потому что:\n\n- map() создаёт новый массив в памяти.\n\n- sort() работает долго\n\nДля поиска минимума и максимума достаточно одного прохода по массиву не создавая промежуточных массивов.","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"arr_max_min = d3.extent(sport_world, d => d[\"Ориентировочное число участников\"])\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"`Результат: минимальное — ${arr_max_min[0]}, максимальное — ${arr_max_min[1]}`\n","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"viewof range_A = Inputs.range(\n [arr_max_min[0], arr_max_min[1]],\n {\n label: \"Участников от:\",\n value: arr_max_min[0],\n step: 10,\n width: 400\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"viewof range_B = Inputs.range(\n [range_A, arr_max_min[1]],\n {\n label: \"до:\",\n value: arr_max_min[1],\n step: 10,\n width: 400\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"const filteredByRange = sport_world.filter(\n d => d[\"Ориентировочное число участников\"] >= range_A &&\n d[\"Ориентировочное число участников\"] <= range_B\n);\n\nconst subjectsInRange = filteredByRange.length;\ndisplay(`Соревнований в диапазоне: ${subjectsInRange} из ${sport_world.length}`);","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"const canvas_bar = (() => {\n const w = 700;\n const h = 50;\n const max_subjects = sport_world.length;\n\n const canvas = document.createElement(\"canvas\");\n canvas.width = w;\n canvas.height = h;\n const context = canvas.getContext(\"2d\");\n\n context.fillStyle = \"hsl(216deg 25% 90%)\";\n context.fillRect(0, 0, w, h);\n\n const bar_width = (subjectsInRange / max_subjects) * w;\n context.fillStyle = \"hsl(216deg 100% 13%)\";\n context.fillRect(0, 0, bar_width, h);\n\n return canvas;\n})();\ndisplay(canvas_bar);","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"2"}} 31:"$30:body"