2b:null 2c:["$","title",null,{"children":"russian combat losses in Ukraine since the beginning of full scale war (Feb 24, 2022) | Roman Sverdan | Observable"}] 31:Tf68,function drawCalendar(category) { const min = d3.min(dailyData, (d) => (d[category] > 0 ? d[category] : null)); const max = d3.max(dailyData, (d) => d[category]); const upperLimit = outliersLimit[0][category] ? outliersLimit[0][category] : max; const maxScale = max > upperLimit ? upperLimit : max; const color = d3.scaleLinear().domain([min, maxScale]).range(colors); const getYearTotal = (year) => { const group = d3.groups(monthlyData[category], (d) => d.year); const currentYear = group.filter((el) => el[0] == year)[0][1]; const total = d3.sum(currentYear, (d) => d.total); return total; }; const svg = d3 .create("svg") .style("width", () => (width < 700 ? width + 120 + "px" : width + "px")) .style("height", height + margin.top + margin.bottom + "px"); const year = svg .selectAll("year") .data(yearsDates) .join("g") .attr("class", (d) => "year " + Object.keys(d)) .attr("font-family", "sans-serif") .attr("font-size", 11) .attr( "transform", (d, i) => `translate(${(yearWidth + yearPadding - 13) * i + margin.left}, ${ margin.top })` ); year .append("text") .attr("x", 0) .attr("y", -8) .attr("font-size", 12) .style("font-weight", "bold") .text((d) => Object.keys(d)); year .append("text") .attr("x", 35) .attr("y", -8) .attr("font-size", 12) .style("fill", colors[1]) .text((d) => { return `Year Total: ${getYearTotal(Object.keys(d)[0]).toLocaleString()}`; }); year .append("g") .selectAll("rect") .data((d) => Object.entries(d)[0][1]) .join("rect") .attr("width", cellSize - 0.2) .attr("height", cellSize - 0.2) .attr("class", "cell") .attr("x", (d) => d.date.getMonth() * cellSize) .attr("y", (d) => d.date.getDate() * cellSize) .attr("fill", (d) => { return !d[category] ? "#e9e9e9" : d[category] > 0 ? color(d[category]) : "steelblue"; }) .on("mousemove", mouseOver) .on("mouseout", mouseOut); year .append("g") .attr("text-anchor", "middle") .selectAll("text") .data((d) => Object.entries(d)[0][1].filter((i) => i.date.getDate() == 1)) .join("text") .attr("x", (d) => d.date.getMonth() * cellSize + cellSize / 2) .attr("y", 10) .text(monthName); function mouseOver(event, d) { if (d.day) { let x = event.pageX + 18; let y = event.pageY + 18; x > width - 200 ? (x = x - 218) : x; toolTip .style("left", x + "px") .style("top", y + "px") .style("display", "block").html(`

${categories[0][category]}
Date:	${d.date.toLocaleString("en-us", { day: "numeric", month: "short" })}
Day of war:	${d.day}
Destroyed:	${d[category]}
Destroyed before:	${ (parseInt().toLocaleString(), totalsUntilDate[d.date.toISOString().slice(0, 10)][category]) }
Total:	${parseInt( csv[csv.length - 1][category] ).toLocaleString()}

`); } d3.select(event.target) .style("stroke", "orange") .style("cursor", "pointer"); } function mouseOut(event, d) { toolTip.style("display", "none"); d3.select(event.target).style("stroke", "none").style("cursor", "pointer"); } return svg.node(); }32:Td37,// Copyright 2021 Observable, Inc. // Released under the ISC license. // https://observablehq.com/@d3/line-chart function LineChartOld( data, { x = ([x]) => x, // given d in data, returns the (temporal) x-value y = ([, y]) => y, // given d in data, returns the (quantitative) y-value defined, // for gaps in data curve = d3.curveStep, // method of interpolation between points marginTop = 20, // top margin, in pixels marginRight = 30, // right margin, in pixels marginBottom = 30, // bottom margin, in pixels marginLeft = 40, // left margin, in pixels width = 640, // outer width, in pixels height = 100, // outer height, in pixels xType = d3.scaleUtc, // the x-scale type xDomain, // [xmin, xmax] chartWidth = width / 2 - marginLeft - marginRight, xRange = [marginLeft, chartWidth], // [left, right] yType = d3.scaleLinear, // the y-scale type yDomain, // [ymin, ymax] yRange = [height - marginBottom, marginTop], // [bottom, top] yFormat, // a format specifier string for the y-axis yLabel, // a label for the y-axis color = "rgb(165, 165, 106)", // stroke color of line strokeLinecap = "round", // stroke line cap of the line strokeLinejoin = "round", // stroke line join of the line strokeWidth = 2.5, // stroke width of line, in pixels strokeOpacity = 1 // stroke opacity of line } = {} ) { // Compute values. const X = d3.map(data, x); const Y = d3.map(data, y); const I = d3.range(X.length); if (defined === undefined) defined = (d, i) => !isNaN(X[i]) && !isNaN(Y[i]); const D = d3.map(data, defined); // Compute default domains. if (xDomain === undefined) xDomain = d3.extent(X); if (yDomain === undefined) yDomain = [0, d3.max(Y)]; // Construct scales and axes. const xScale = xType(xDomain, xRange); const yScale = yType(yDomain, yRange); const xAxis = d3 .axisBottom(xScale) .ticks(width / 80) .tickSizeOuter(0) .tickFormat(d3.timeFormat("%b")); const yAxis = d3.axisLeft(yScale).ticks(height / 40, yFormat); // Construct a line generator. const line = d3 .line() .defined((i) => D[i]) // .curve(curve) .x((i) => xScale(X[i])) .y((i) => yScale(Y[i])); const svg = d3 .create("svg") // .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width / 2 - marginRight, height]) .attr("style", "max-width: 100%; height: auto; height: intrinsic;"); svg .append("g") .attr("transform", `translate(0,${height - marginBottom})`) .call(xAxis); svg .append("g") .attr("transform", `translate(${marginLeft},0)`) .call(yAxis) .call((g) => g.select(".domain").remove()) .call((g) => g .selectAll(".tick line") .clone() .attr("x2", chartWidth - marginLeft) .attr("stroke-opacity", 0.1) ) .call((g) => g .append("text") .attr("x", -marginLeft) .attr("y", 10) .attr("fill", "currentColor") .attr("text-anchor", "start") .text(yLabel) ); svg .append("path") .attr("fill", "none") .attr("stroke", color) .attr("stroke-width", strokeWidth) .attr("stroke-linecap", strokeLinecap) .attr("stroke-linejoin", strokeLinejoin) .attr("stroke-opacity", strokeOpacity) .attr("d", line(I)); return svg.node(); }33:Tb94,function LineChart(data) { const blockWidth = yearWidth + yearPadding - 15; const svg = d3 .create("svg") .style("width", () => (width < 700 ? width + 120 + "px" : width + "px")) .style("height", "240px"); const yearGroups = d3.groups(data, (d) => d.year); const yMax = d3.max(data, (d) => d.total); const y = d3.scaleLinear().domain([yMax, 0]).nice().range([0, blockWidth]); const yAxis = (g) => g .attr( "transform", `translate(${blockWidth * yearGroups.length + 45}, 20)` ) .call( d3 .axisLeft(y) .ticks(6) .tickSize(blockWidth * yearGroups.length + 5) ) .call((g) => g.select(".domain").remove()) .call((g) => g .selectAll(".tick line") .attr("stroke-opacity", 0.2) .attr("stroke-dasharray", "2,2") ); yearGroups.forEach((year, i) => { const x = d3 .scaleUtc() .domain([ new Date(Date.UTC(year[0], 0, 1)), new Date(Date.UTC(year[0], 11, 31)) ]) .range([0, blockWidth]); const line = d3 .line() .curve(d3.curveStep) .x((d) => x(d.date)) .y((d) => y(d.total)); const xAxis = (g) => g .attr("transform", `translate(0, ${blockWidth})`) .call(d3.axisBottom(x).ticks(6)); const yearGroup = svg .append("g") .attr("class", () => "year " + year[0]) .attr("font-family", "sans-serif") .attr("font-size", 11) .attr( "transform", `translate(${(yearWidth + yearPadding - 13) * i + margin.left}, ${ margin.top })` ); // Compute average for this year const yearAverage = d3.mean(year[1], (d) => d.total); // y position for the average const yAvg = y(yearAverage); // Draw average line for this year yearGroup .append("line") .attr("x1", 0) .attr("x2", blockWidth) .attr("y1", yAvg) .attr("y2", yAvg) .attr("stroke", "red") .attr("stroke-dasharray", "4,2") .attr("stroke-width", 0.5); yearGroup .append("text") .attr("x", blockWidth - 2) .attr("y", yAvg + 10) .attr("text-anchor", "end") .attr("fill", "red") .attr("font-size", "9px") .text(yearAverage.toFixed(1)); // Chart yearGroup .append("rect") .attr("x", 0) .attr("y", 0) .attr("width", blockWidth) .attr("height", blockWidth) .attr("fill", "lightgray") .attr("opacity", 0.2); yearGroup .append("path") .datum(year[1]) .attr("fill", "none") .attr("stroke", colors[0]) .attr("stroke-width", 2.5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("transform", `translate(7.5, 0)`) .attr("d", line); yearGroup.append("g").attr("class", "x_axis").call(xAxis); }); svg.append("g").call(yAxis); return svg.node(); }34:[] 2f:{"id":"3efe80049c33b34e","slug":"ru-losses-in-ukraine","title":"russian combat losses in Ukraine since the beginning of full scale war (Feb 24, 2022)","thumbnail":"c91387dc9010ee8236dc538078900e35e34d863c873ad0f9f06e3bc17258015e","access_level":"public","create_time":"$D2023-01-02T17:36:11.289Z","update_time":"$D2026-04-24T06:16:19.229Z","view_time":null,"first_public_time":"$D2023-01-02T17:36:11.289Z","fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"36db9f151dbeb3bc","login":"romansverdan","name":"Roman Sverdan","avatar_url":"https://avatars-next.observableusercontent.com/f10a4afffb8f95850eb88bda500106e7c81993daee3682132a6b9dde86884569","tier":"starter_2024"},"version":1161,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"2c1ee78e30fade9b","login":"romansverdan","name":"Roman Sverdan","avatar_url":"https://avatars-next.observableusercontent.com/f10a4afffb8f95850eb88bda500106e7c81993daee3682132a6b9dde86884569","tier":null}],"members":[{"type":"individual","id":"2c1ee78e30fade9b","login":"romansverdan","name":"Roman Sverdan","avatar_url":"https://avatars-next.observableusercontent.com/f10a4afffb8f95850eb88bda500106e7c81993daee3682132a6b9dde86884569","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"41e58452cdbb35f1","slug":"russian-war-data","title":"War in Ukraine","owner":{"id":"36db9f151dbeb3bc","login":"romansverdan","name":"Roman Sverdan"}},"type":"notebook","body":{"title":"russian combat losses in Ukraine since the beginning of full scale war (Feb 24, 2022)","cells":[{"id":0,"value":"# russian combat losses in Ukraine since the beginning of full scale war (Feb 24, 2022)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":292,"value":"Total combat losses of the russian enemy since the beginning of the full scale invasion of Ukraine, 24.02.2022. \nOriginal data source @GeneralStaffUA.\nCleaned and formatted CSV data is available at my Github repo here. \n\n`Last data update: ${dailyData[dailyData.length-1].date.toISOString().slice(0, 10)}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":753,"value":"Swatches(d3.scaleOrdinal([\"- mistakes in the data\"], d3.schemeCategory10))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":290,"value":"### Personnel, `${parseInt(csv[csv.length - 1]['personnel']).toLocaleString()}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":801,"value":"drawLegend(\"personnel\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":203,"value":"personnel = html`\n

${drawDayNumbers()}

${drawCalendar(\"personnel\")}

${LineChart(monthlyData[\"personnel\"])}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":852,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":346,"value":"### Unmanned Aerial Vehicle, `${parseInt(csv[csv.length - 1]['uav']).toLocaleString()}`\noperational tactical level","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":825,"value":"drawLegend(\"uav\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":344,"value":"uav = html`\n

${drawDayNumbers()}

${drawCalendar(\"uav\")}

${LineChart(monthlyData[\"uav\"])}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":840,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":733,"value":"### Tanks, `${parseInt(csv[csv.length - 1]['tanks']).toLocaleString()}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":804,"value":"drawLegend(\"tanks\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":725,"value":"tanks = html`\n

${drawDayNumbers()}

${drawCalendar(\"tanks\")}

${LineChart(monthlyData[\"tanks\"])}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":850,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":335,"value":"### Armored Personnel Vehicles, `${parseInt(csv[csv.length - 1]['apv']).toLocaleString()}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":810,"value":"drawLegend(\"apv\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":332,"value":"apv = html`\n

${drawDayNumbers()}

${drawCalendar(\"apv\")}

${LineChart(monthlyData[\"apv\"])}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":848,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":320,"value":"### Aircrafts, `${parseInt(csv[csv.length - 1]['aircrafts'])}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":813,"value":"drawLegend(\"aircrafts\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":314,"value":"aircrafts = html`\n

${drawDayNumbers()}

${drawCalendar(\"aircrafts\")}

${LineChart(monthlyData[\"aircrafts\"])}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":846,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":351,"value":"### Helicopters, `${parseInt(csv[csv.length - 1]['helicopters'])}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":816,"value":"drawLegend(\"helicopters\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":349,"value":"helicopters = html`\n

${drawDayNumbers()}

${drawCalendar(\"helicopters\")}

${LineChart(monthlyData[\"helicopters\"])}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":844,"value":"

\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":329,"value":"### Cruise Missiles, `${parseInt(csv[csv.length - 1]['cruise_missiles'])}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":819,"value":"drawLegend(\"cruise_missiles\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":327,"value":"cruise_missiles = html`\n

${drawDayNumbers()}

${drawCalendar(\"cruise_missiles\")}

${LineChart(monthlyData[\"cruise_missiles\"])}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":842,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":342,"value":"### Artillery, `${parseInt(csv[csv.length - 1]['artillery']).toLocaleString()}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":822,"value":"drawLegend(\"artillery\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":338,"value":"artillery = html`\n

${drawDayNumbers()}

${drawCalendar(\"artillery\")}

${LineChart(monthlyData[\"artillery\"])}

\n \n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":836,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":772,"value":"### Warships, `${parseInt(csv[csv.length - 1]['warships']).toLocaleString()}`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":828,"value":"drawLegend(\"warships\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":767,"value":"warships = html`\n

${drawDayNumbers()}

${drawCalendar(\"warships\")}

${LineChart(monthlyData[\"warships\"])}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":854,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":325,"value":"
\n### Main func","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":70,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":209,"value":"function drawDayNumbers() {\n const svg = d3\n .create(\"svg\")\n .attr(\"width\", margin.left)\n .style(\"font\", \"10px sans-serif\")\n .style(\"width\", \"40px\")\n .style(\"height\", height + margin.top + margin.bottom);\n\n const hours = svg\n .selectAll(\"text\")\n .data(d3.range(0, 32))\n .join(\"text\")\n .attr(\"text-anchor\", \"end\")\n .attr(\"x\", margin.left)\n .attr(\"y\", (d, i) => margin.top + i * cellSize + cellSize / 2)\n .attr(\"dx\", \"-.5em\")\n .attr(\"dy\", \".3em\")\n .text((d) => (d !== 0 ? d : \"\"));\n\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":566,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":887,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":160,"value":"
\n### Settings","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":61,"value":"margin = ({ top: 20, right: 10, bottom: 10, left: 40 })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"cellSize = 15","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":417,"value":"colors = [\"#c2c287\", \"#333027\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"yearPadding = cellSize * 3","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"yearWidth = cellSize * 10","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":73,"value":"height = 470","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":237,"value":"parseDate = d3.utcParse(\"%Y-%m-%d\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"parseYear = d3.utcParse(\"%Y\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":140,"value":"function daysInMonth(date) {\n return date.getDate();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":183,"value":"monthName = (d) => \"JFMAMJJASOND\"[d.date.getMonth()]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":281,"value":"categories = [\n {\n personnel: \"Personnel\",\n apv: \"Armored Personnel Vehicles\",\n tanks: \"Tanks\",\n helicopters: \"Helicopters\",\n aircrafts: \"Aircrafts\",\n artillery: \"Artillery\",\n cruise_missiles: \"Cruise Missiles\",\n mlrs: \"Multiple Launch Rocket Systems\",\n special_equipment: \"Special Equipment\",\n vehicles_fuel_tanks: \"Vehicles & Fuel Tanks\",\n aaws: \"Anti-aircraft warfare\",\n uav: \"Unmanned Aerial Vehicle\",\n warships: \"Warships\"\n }\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":308,"value":"outliersLimit = [\n {\n personnel: 1800,\n apv: 140\n }\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":164,"value":"toolTip = d3.select(\"body\").append(\"div\").attr(\"class\", \"toolTip\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":392,"value":"function dateToStr(day) {\n console.log(day);\n if (day) {\n const d = day.getDate();\n const m = day.getMonth() + 1; //Month from 0 to 11\n const y = day.getFullYear();\n return \"\" + y + \"-\" + (m <= 9 ? \"0\" + m : m) + \"-\" + (d <= 9 ? \"0\" + d : d);\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":684,"value":"function getMonthlyData(data, category) {\n let maxValue = parseInt(csv[csv.length - 1][category]);\n return Array.from(\n d3.group(\n data,\n (d) => d.date.getFullYear() + \"-\" + (parseInt(d.date.getMonth()) + 1)\n )\n ).map((el) => {\n let total = d3.sum(el[1], (i) => i[category]);\n return {\n date: parseDate(el[0] + \"-1\"),\n total: total,\n percent: (total / maxValue) * 100\n };\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":780,"value":"drawLegend = (category) => {\n const range = d3.extent(\n dailyData.filter((el) => el[category] >= 0),\n (d) => d[category]\n );\n\n const upperLimit = outliersLimit[0][category]\n ? outliersLimit[0][category]\n : range[1];\n\n const maxScale = range[1] > upperLimit ? upperLimit : range[1];\n return Legend(d3.scaleSequential([range[0], maxScale], colors), {\n title: \"Number of losses\"\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":179,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":158,"value":"
\n### Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":232,"value":"csv = d3.csv(\n \"https://raw.githubusercontent.com/romansverdan/russian-Losses-in-Ukraine/main/data/russia_losses.csv\"\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":446,"value":"csv","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":235,"value":"dailyData = {\n const columns = Object.keys(csv[0]);\n let daysCount = 0;\n let res = csv.map((d) => {\n const obj = {};\n columns.forEach((col, i) => {\n if (i === 0) {\n obj[col] = parseDate(d[col]);\n } else if (i === 1) {\n obj[col] = parseInt(d[col]);\n } else {\n if (daysCount === 0) {\n obj[col] = parseInt(d[col]);\n } else {\n obj[col] = parseInt(d[col]) - parseInt(csv[daysCount - 1][col]);\n }\n }\n });\n daysCount++;\n return obj;\n });\n return res;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":863,"value":"dailyData","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":241,"value":"dataByDates = dailyData.reduce(\n (obj, item) => Object.assign(obj, { [dateToStr(item.date)]: item }),\n {}\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":277,"value":"totalsUntilDate = csv.reduce(\n (obj, item) =>\n Object.assign(obj, {\n [parseDate(item.date).toISOString().slice(0, 10)]: item\n }),\n {}\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"years = [2022, 2023, 2024, 2025, 2026]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"yearsDates = years.map((el) => {\n let res = {};\n const days = d3.timeDays(\n new Date(parseYear(el).getFullYear(), 0, 1),\n new Date(parseYear(el).getFullYear() + 1, 0, 1)\n );\n res[el] = days.map((day) => {\n const dayIso = day.toISOString().slice(0, 10);\n const dayStr = dateToStr(day);\n if (dataByDates[dayStr]) {\n return dataByDates[dayStr];\n } else {\n return { date: day };\n }\n });\n return res;\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":504,"value":"monthlyData = {\n const categories = Object.keys(dailyData[0]).slice(2);\n const grouped = {};\n\n categories.forEach((category) => {\n let group = Array.from(\n d3.group(\n dailyData,\n (d) => d.date.getFullYear() + \"-\" + (parseInt(d.date.getMonth()) + 1)\n )\n ).map((el) => {\n let total = d3.sum(el[1], (i) => i[category]);\n return {\n year: el[0].split(\"-\")[0],\n date: parseDate(el[0] + \"-1\"),\n total: total\n };\n });\n grouped[category] = group;\n });\n return grouped;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"
\n### Libs","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":4,"value":"d3 = require(\"d3@7.8.0\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":411,"value":"import { Legend, Swatches } from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 30:"$2f:body"