2d:null 2e:["$","title",null,{"children":"BMI & BODY FAT Calculator | cadasa | Observable"}] 33:T9a6,charted = { var margin = {top: 20, right: 10, bottom: 20, left: 30}; var w = Math.min(width, 850) - margin.left - margin.right; var h = w / 2.018 - margin.top - margin.bottom; var svg = DOM.svg(w + margin.left + margin.right, h + margin.top + margin.bottom); var x = d3.scaleLinear().domain([30, 180]).rangeRound([0, w]); var y = d3.scaleLinear().domain([1.3, 2]).rangeRound([h, 0]); var g = d3.select(svg).append('g') .attr('transform', `translate(${margin.left}, ${margin.top})`); weightRange(0.1, 18.5, "#e5ffef", 'Underweight', 50); weightRange(18.5, 25.0, "#88eaac", 'Normal weight', 88); weightRange(25.0, 30.0, "#ffbb63", 'Pre-obesity', 112); weightRange(30.0, 35.0, "#ff7c69", 'Obesity class I', 132); weightRange(35.0, 40.0, "red", 'Obesity class II', 152); weightRange(40.0, 999.9, "darkred", 'Obesity class III', 172); g.append('g') .attr('transform', `translate(0, ${h})`) .call(d3.axisBottom(x)) .append("text") .attr("fill", "#000") .attr("x", w) .attr("y", -6) .attr("dy", "0") .attr("text-anchor", "end") .text("Weight (Kilograms)"); g.append('g') .call(d3.axisLeft(y).ticks(5)) .append("text") .attr("fill", "#000") .attr("transform", "rotate(-90)") .attr("y", 6) .attr("dy", "0.71em") .attr("text-anchor", "end") .text("Height (Meters)"); if (BMI) { g.append('circle') .attr('cx', x(weight)) .attr('cy', y(height)) .attr('r', 3) .attr('fill', 'none') .attr('stroke-width', 2) .attr('stroke', 'black'); g.append('text') .style('font-family', 'sans-serif') .style('font-size', 11) .attr('fill', 'black') .attr('alignment-baseline', 'middle') .attr('text-anchor', 'start') .attr('x', x(weight) + 8) .attr('y', y(height) + 0.5) .text(`BMI: ${BMI}`); } function weightRange(minBMI, maxBMI, color, label, labelWeight) { var area = d3.area() .x(d => x(d)) .y0(d => Math.min(h, y(invertHeight(d, minBMI)))) .y1(d => Math.min(h, y(invertHeight(d, maxBMI)))); g.append('path') .datum(x.ticks(100)) .attr('fill', color) .attr('d', area); g.append('text') .style('font-family', 'sans-serif') .style('font-size', 11) .attr('fill', 'black') .attr('text-anchor', 'middle') .attr('x', x(labelWeight)) .attr('y', -5) .text(label); } return svg; }34:T1a8a,viewof men = html`

MEN

AGE	BODY FAT for MEN [%]
18-20	2.0	3.9	6.2	8.5	10.5	12.5	14.3	16.0	17.5	18.9	20.2	21.3	22.3	23.1	23.8	24.3	24.9
21-25	2.5	4.9	7.3	9.5	11.6	13.6	15.4	17.0	18.6	20.0	21.2	22.3	23.3	24.2	24.9	25.4	25.8
26-30	3.5	6.0	8.4	10.6	12.7	14.6	16.4	18.1	19.6	21.0	22.3	23.4	24.4	25.2	25.9	26.5	26.9
31-35	4.5	7.1	9.4	11.7	13.7	15.7	17.5	19.2	20.7	22.1	23.4	24.5	25.5	26.3	27.0	27.5	28.0
36-40	5.6	8.1	10.5	12.7	14.8	16.8	18.6	20.2	21.8	23.2	24.4	25.6	26.5	27.4	28.1	28.6	29.0
41-45	6.7	9.2	11.5	13.8	15.9	17.8	19.6	21.3	22.8	24.7	25.5	26.6	27.6	28.4	29.1	29.7	30.1
46-50	7.7	10.2	12.6	14.8	16.9	18.9	20.7	22.4	23.9	25.3	26.6	27.7	28.7	29.5	30.2	30.7	31.2
51-55	8.8	11.3	13.7	15.9	18.0	20.0	21.8	23.4	25.0	26.4	27.6	28.7	29.7	30.6	31.2	31.8	32.2
56 & UP	9.9	12.4	14.7	17.0	19.1	21.0	22.8	24.5	26.0	27.4	28.7	29.8	30.8	31.6	32.3	32.9	33.3
	LEAN				IDEAL				AVERAGE					ABOVE AVERAGE

`35:T183c,viewof women = html`

WOMEN

AGE	BODY FAT for WOMEN [%]
18-20	11.3	13.5	15.7	17.7	19.7	21.5	23.2	24.8	26.3	27.7	29.0	30.2	31.3	32.3	33.1	33.9	34.6
21-25	11.9	14.2	16.3	18.4	20.3	22.1	23.8	25.5	27.0	28.4	29.6	30.8	31.9	32.9	33.8	34.5	35.2
26-30	12.5	14.8	16.9	19.0	20.9	22.7	24.5	26.1	27.6	29.0	30.3	31.5	32.5	33.5	34.4	35.2	35.8
31-35	13.2	15.4	17.6	19.6	21.5	23.4	25.1	26.7	28.2	28.6	30.9	32.1	33.2	34.1	35.0	35.8	36.4
36-40	13.8	16.0	18.2	20.2	22.2	24.0	25.7	27.3	28.8	30.2	31.5	32.7	33.8	34.8	35.6	36.4	37.0
41-45	14.4	16.7	18.8	20.8	22.8	24.6	26.3	27.9	29.4	30.8	32.1	33.3	34.4	35.4	36.3	37.0	37.7
46-50	15.0	17.3	19.4	21.5	23.4	25.2	26.9	28.6	30.1	31.5	32.8	34.0	35.0	36.0	36.9	37.6	38.3
51-55	15.6	17.9	20.0	22.1	24.0	25.9	27.6	29.2	30.7	32.1	33.4	34.6	35.6	36.6	37.5	38.3	38.9
56 & UP	16.3	18.5	20.7	22.7	24.6	26.5	28.2	29.8	31.3	32.7	34.0	35.2	36.3	37.2	38.1	38.9	39.5
	LEAN					IDEAL			AVERAGE						ABOVE AVERAGE

`36:[] 31:{"id":"a84445457779cc7d","slug":"bmi-calculator","title":"BMI & BODY FAT Calculator","thumbnail":"0548fdaa5483222066f846290407663e59d3085ebfd68c83489ab1b98a813a48","access_level":"public","create_time":"$D2021-05-25T19:28:35.789Z","update_time":"$D2024-04-05T19:30:40.813Z","view_time":null,"first_public_time":"$D2021-05-25T19:36:19.204Z","has_unpublished_edits":null,"fork":{"id":"577b52a2f6064b5f","slug":"bmi-calculator","title":"BMI Calculator","owner":{"id":"172cc08ef8a18a4b","login":"jashkenas","name":"Jeremy Ashkenas"}},"stars":2,"starred":false,"owner":{"type":"team","id":"f2c21786e0c9f50c","login":"cadasa","name":"","avatar_url":"https://avatars-next.observableusercontent.com/ab674faa5225df87e3b6d0c39c11f8240464927b74871667227ac0f6e47fda2b","tier":"starter_2024"},"version":429,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"d335f8179e5150bf","login":"cadasa","name":"","avatar_url":"https://avatars-next.observableusercontent.com/ab674faa5225df87e3b6d0c39c11f8240464927b74871667227ac0f6e47fda2b","tier":null}],"members":[{"type":"individual","id":"d335f8179e5150bf","login":"cadasa","name":"","avatar_url":"https://avatars-next.observableusercontent.com/ab674faa5225df87e3b6d0c39c11f8240464927b74871667227ac0f6e47fda2b","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"BMI & BODY FAT Calculator","cells":[{"id":0,"value":"viewof title = md`# BMI & BODY FAT Calculator`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"viewof system = radio({options: [\"imperial\", \"metric\"], value: \"metric\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":325,"value":"dashboard = html` \n \n \n \n \n \n \n

\n ${viewof height}\n

\n ${viewof weight}\n

\n ${viewof Age}\n

\n ${viewof gender}\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"calculated = BMI && md`Your BMI (Body Mass Index) of **${BMI}** is classified as **${classification}** and your Lean Body Mass (Muscle Mass, Body Water, Bones, Skin, Organs) is **${LBM} kgs**.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":115,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":364,"value":"calculated2 = Fat_percentage && md`Your Body Fat is **${Fat_percentage}%** (Body Fat Mass is **${BFM} kgs**). See classification in the tables below:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":376,"value":"dashboard2 = html` \n \n \n \n \n

\n ${viewof men}\n

\n ${viewof women}\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":339,"value":"viewof gender = radio({title: \"Gender\", options: [\"Male\", \"Female\"], value: \"Male\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":342,"value":"viewof Age = {\n var Age = html`

`;\n var age = number({ title: \"Age\", step: 1, min: 18, max: 80, value: 52 });\n append(Age, age, update);\n function update() {\n Age.value = age.value;\n }\n\n update();\n return Age;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"viewof height = {\n var height = html`

`\n if (system === \"imperial\") {\n\tvar feet = number({title: \"Feet\", min: 0, max: 100});\n var inches = number({title: \"Inches\", min: 0, max: 12, step: 0.1});\n feet.style.display = inches.style.display = \"inline-block\";\n feet.style.marginRight = \"20px\";\n append(height, feet, update), append(height, inches, update);\n } else {\n var meters = number({title: \"Height (Meters)\", step: 0.01, min: 0, max: 100, value:1.78});\n append(height, meters, update);\n }\n \n function update() {\n if (system === \"imperial\") {\n height.value = ((feet.value || 0) + (inches.value || 0) / 12) / 3.28;\n } else {\n height.value = meters.value;\n }\n }\n \n update();\n return height;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":66,"value":"viewof weight = {\n var weight = html`

`;\n if (system === \"imperial\") {\n var pounds = number({ title: \"Pounds\", min: 0, max: 1000, step: 0.1 });\n append(weight, pounds, update);\n } else {\n var kilos = number({\n title: \"Weight (Kilograms)\",\n min: 0,\n max: 1000,\n step: 0.1,\n value: 70\n });\n append(weight, kilos, update);\n }\n\n function update() {\n if (system === \"imperial\") {\n weight.value = pounds.value / 2.2046226218;\n } else {\n weight.value = kilos.value;\n }\n }\n\n update();\n return weight;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":357,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":360,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":347,"value":"function get_body_fat_perc(gender){\n var Fat_percentage;\n if(gender==\"Male\"){\n Fat_percentage = (1.2*BMI +0.23*Age - 16.2).toFixed(1)\n }else{\n Fat_percentage = (1.2*BMI +0.23*Age - 5.4).toFixed(1)\n }\n return Fat_percentage;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":349,"value":"Fat_percentage = get_body_fat_perc(gender)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":392,"value":"BFM = (Fat_percentage*weight / 100).toFixed(2)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":398,"value":"LBM = (weight - BFM).toFixed(2)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"BMI = height && weight ? Math.round(weight / (height * height) * 10) / 10 : null","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"classification = !BMI ? null :\n\t\t\t BMI < 18.5 ? \"underweight\" : \n\t\t\t BMI < 25.0 ? \"normal weight\" :\n\t\t\t\t BMI < 30.0 ? \"pre-obesity\" : \n BMI < 35.0 ? \"obesity class I\" :\n BMI < 40.0 ? \"obesity class II\" : \"obesity class III\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":164,"value":"function invertHeight(weight, bmi) {\n return Math.sqrt(weight / bmi);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":68,"value":"function append(element, input, update) {\n element.append(input);\n input.addEventListener(\"input\", update);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"import {number, radio} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":113,"value":"d3 = require('d3')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 32:"$31:body"