31:T839,md`# AFM Diagram of Igneous Petrology *Not to be confused with the AFM diagram of metamorphic petrology* The AFM diagram is a ternary plot used to show the relative proportions of the oxides of alkalis (A), iron (F), and magnesium (M) in igneous rocks. The components of the diagram are thus **A** (Alkalis: Na₂O + K₂O), **F** (FeO & Fe₂0₃), and **M** (MgO). This diagram includes the boundaries between the "tholeiitic" and "calc-alkaline" or "olivine" fields (heavy lines) as proposed Irvine and Baragar (1971). In the classification of Irvine and Baragar the three main series are : 1. The tholeiitic basalt 2. Calc-alkali 3. Alkali olivine basalt series ## Sources * [Tulane University - Igneous Rocks and Plate Tectonics](http://www.tulane.edu/~sanelson/eens211/igneous_rocks_plate_tectonics.htm) - Prof. Stephen A. Nelson * [Wikipedia - Igneous Rocks](https://en.wikipedia.org/wiki/Igneous_rock#Chemical_classification_and_petrology) ` //* [*A Dictionary of Geology and Earth Sciences*](https://www.oxfordreference.com/view/10.1093/oi/authority.20110803095354650) - Michael Allaby, Oxford University Press, 2013, ISBN-139780199653065 // Triangular diagrams are often used to show the compositional ranges in minerals // The AFM diagram is a ternary plot used to show how metamorphic mineral assemblages vary as a function of rock composition within one metamorphic facies. // Besides SiO₂, the five most abundant oxides found in metamorphic rocks are Al₂O₃, CaO, FeO, MgO, and K₂O. // The components of the diagram are thus Alkalis (Na₂O + K₂O ) **A** , **F** (*FeO*), and **M** (*MgO*). // A–alkali (sodium and potassium) oxides, F–iron oxides, M–magnesium oxide, BT–tholeiitic basalt, FB–ferro-basalt, ABT–tholeiitic basaltic andesite, AT–tholeiitic andesite, D–dacite, R–rhyolite, B–basalt, AB–basaltic andesite, A–andesite; dashed line–boundary between tholeiitic and calc-alkaline compositions. // (*Al₂O₃*)32:T68f,drawTernaryPlot = someTernaryPlot => { const svg = d3.select(DOM.svg(width, height)); const radius = someTernaryPlot.radius(); const chart = svg .append("g") .attr("transform", `translate(${width / 2} ${height / 2 + yOffset})`) .attr("height", 300) .attr("font-family", "sans-serif") .attr("id", "chart") .on("mousemove", d => { const xy = d3.pointer(d); mutable inverse = afmDiagram.invert(xy); }); const defs = chart.append("defs"); const clipPath = defs .append("clipPath") .attr("id", "trianglePath") .append("path") .attr("d", someTernaryPlot.triangle()); const axisLabelsGroup = chart .append("g") .attr("class", "axis-labels") .call(axisLabels, someTernaryPlot.axisLabels()); const gridLinesPaths = someTernaryPlot .gridLines() .map(axisGrid => axisGrid.map(d3.line()).join(" ")); const gridGroup = chart .append("g") .attr("class", "grid") .call(grid, gridLinesPaths); const axisTicksGroups = chart .append("g") .attr("class", "ternary-ticks") .attr("font-size", 10) .selectAll("g") .data(someTernaryPlot.ticks()) .join("g") .attr("class", "axis-ticks"); const trianglePath = chart .append("path") .attr("d", someTernaryPlot.triangle()) .attr("id", "triangle") .attr("fill", "none") .attr("stroke", "black") .attr("stroke-width", 2); axisTicksGroups.call(ticks); const dividingPath = chart .append("path") .attr("id", "divide") .attr("d", makeCurvedLine(dividingLineTernary)) .attr("fill", "none") .attr("stroke", "black") .attr("stroke-width", 2); return svg.node(); }33:[] 2f:{"title":"AFM Diagram of Igneous Petrology","cells":[{"id":0,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":164,"value":"html`\n\n \n ${afmDiagram.labels().map(label => ``)}\n \n \n ${\n inverse.length\n ? inverse.map(value => ``)\n : `Drag the slider on the plot`\n } \n \n

${label}
${format(value)}

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":49,"value":"viewof afm = drawTernaryPlot(afmDiagram)","pinned":true,"hidden":false,"mode":"ojs"},{"id":242,"value":"dividingLine = [\n { a: 35, f: 15, m: 50 },\n { a: 52, f: 23, m: 25 },\n { a: 35, f: 60, m: 5 }\n]","pinned":true,"hidden":false,"mode":"ojs"},{"id":273,"value":"dividingLineTernary = dividingLine\n .map(afmBarycentric)\n .map(([x, y]) => [x * radius, y * radius])\n// .map(afmDiagram.convert)","pinned":true,"hidden":false,"mode":"ojs"},{"id":66,"value":"makeCurvedLine = d3.line().curve(d3.curveCardinal)","pinned":true,"hidden":false,"mode":"ojs"},{"id":14,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":44,"value":"axisLabels = (g, labels) =>\n g\n .append(\"g\")\n .attr(\"class\", \"labels\")\n .attr(\"font-size\", 16)\n .selectAll(\"text\")\n .data(labels)\n .join(\"text\")\n .attr(\"dy\", (d, i) => (i === 2 ? \"-0.5em\" : \".5em\"))\n .attr(\n \"transform\",\n (d, i) => `translate(${d.position})rotate(${d.labelAngle})`\n )\n .attr(\"text-anchor\", \"middle\")\n .text(d => d.label)","pinned":true,"hidden":false,"mode":"ojs"},{"id":43,"value":"ticks = (g, ticks) =>\n g\n .selectAll(\"g\")\n .data(d => d, d => d.tick)\n .join(\n enter => {\n const tickGroups = enter\n .append(\"g\")\n .attr(\"class\", \"tick\")\n .attr(\"transform\", d => `translate(${d.position})`);\n\n tickGroups\n .append(\"text\")\n .attr(\"text-anchor\", d => d.textAnchor)\n .attr(\"transform\", d => `rotate(${d.angle})`)\n .attr(\"dx\", d => (-d.size - 5) * (d.textAnchor === \"start\" ? -1 : 1))\n .attr(\"dy\", \".5em\")\n .text(d => d.tick);\n\n tickGroups\n .append(\"line\")\n .attr(\"transform\", d => `rotate(${d.angle + 90})`)\n .attr(\"y2\", d => d.size * (d.textAnchor === \"start\" ? -1 : 1))\n .attr(\"stroke\", \"grey\");\n\n return tickGroups;\n },\n update =>\n update\n .attr(\"fill\", \"steelblue\")\n .attr(\"transform\", d => `translate(${d.position})`),\n exit => exit.attr(\"opacity\", 0).remove()\n )","pinned":true,"hidden":false,"mode":"ojs"},{"id":40,"value":"grid = (g, gridLines) =>\n g\n .selectAll(\"path\")\n .data(gridLines)\n .join(\n enter =>\n enter\n .append(\"path\")\n .attr(\"d\", d => d)\n .attr(\"stroke\", \"#f1f1f1\")\n .attr(\"stroke-width\", (d, i) => (i & 1 ? 1 : 2)),\n update => update.attr('d', d => d)\n // theres no exit, lines are only drawn upto 'initial' triangle bounds\n )","pinned":true,"hidden":false,"mode":"ojs"},{"id":12,"value":"afmDiagram = ternaryPlot(afmBarycentric)\n .radius(radius)\n .labels([\"A\", \"F\", \"M\"])\n .gridLineCounts([20, 20, 20])\n .tickCounts([10, 10, 10])\n .labelAngles([0, 0, 0])","pinned":true,"hidden":false,"mode":"ojs"},{"id":36,"value":"mutable inverse = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":9,"value":"afmBarycentric = barycentric()\n .a(d => d.a)\n .b(d => d.f)\n .c(d => d.m)","pinned":true,"hidden":false,"mode":"ojs"},{"id":177,"value":"format = d3.format(\".2%\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":21,"value":"md`## Dimensions`","pinned":false,"hidden":false,"mode":"ojs"},{"id":28,"value":"height = 640","pinned":true,"hidden":false,"mode":"ojs"},{"id":26,"value":"radius = Math.min(width, height) / 2","pinned":true,"hidden":false,"mode":"ojs"},{"id":20,"value":"// to keep the triangle centered\nyOffset = radius / 4","pinned":true,"hidden":false,"mode":"ojs"},{"id":16,"value":"md`## Imports`","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"import {\n barycentric,\n ternaryPlot\n} from \"@julesblm/scratchpad-d3-ternary-plot-ii\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":4,"value":"d3 = require('d3@v6')","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}