math-exercises 3.0.191 → 3.0.193

package/lib/exercises/math/dataRepresentations/barChart/barChartInterpreting.d.ts

@@ -0,0 +1,53 @@
+import { Exercise } from "../../../../exercises/exercise.js";
+type Identifiers = {
+    barChart: BarChart;
+    itemAsked: AskedItem;
+    questionStr: string;
+    answerStr: string;
+    displayType: string;
+};
+type AskedItem = {
+    type: "xForCategory" | "categoryForX";
+    isLess: boolean;
+    ordinal: number;
+    index: number;
+};
+type ColorStyle = {
+    type: "color";
+    color: string;
+    frStr: string;
+};
+type FillStyle = {
+    type: "fill";
+    fill: number;
+    frStr: string;
+};
+type CategoryProps = {
+    name: string;
+    frStr: string;
+};
+type CategoryStyle = ColorStyle | FillStyle;
+type Category = {
+    props: CategoryProps;
+    style: CategoryStyle;
+};
+type BarProps = {
+    label: string;
+    frStr: string;
+};
+type Bar = {
+    props: BarProps;
+    data: number[];
+};
+type BarChart = {
+    description: string;
+    axisLabels: string[];
+    bars: Bar[];
+    categories: Category[];
+};
+type Options = {
+    displayType: string;
+};
+export declare const barChartInterpreting: Exercise<Identifiers, Options>;
+export {};
+//# sourceMappingURL=barChartInterpreting.d.ts.map

package/lib/exercises/math/dataRepresentations/barChart/barChartInterpreting.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"barChartInterpreting.d.ts","sourceRoot":"","sources":["../../../../../src/exercises/math/dataRepresentations/barChart/barChartInterpreting.ts"],"names":[],"mappings":"AAAA,OAAO,EAYL,QAAQ,EAKT,MAAM,6BAA6B,CAAC;AAYrC,KAAK,WAAW,GAAG;IACjB,QAAQ,EAAE,QAAQ,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,cAAc,GAAG,cAAc,CAAC;IACtC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,UAAU,GAAG;IAChB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,aAAa,GAAG,UAAU,GAAG,SAAS,CAAC;AAE5C,KAAK,QAAQ,GAAG;IACd,KAAK,EAAE,aAAa,CAAC;IACrB,KAAK,EAAE,aAAa,CAAC;CACtB,CAAC;AAEF,KAAK,QAAQ,GAAG;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,GAAG,GAAG;IACT,KAAK,EAAE,QAAQ,CAAC;IAChB,IAAI,EAAE,MAAM,EAAE,CAAC;CAChB,CAAC;AAEF,KAAK,QAAQ,GAAG;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,UAAU,EAAE,QAAQ,EAAE,CAAC;CACxB,CAAC;AA4tBF,KAAK,OAAO,GAAG;IACb,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAsBF,eAAO,MAAM,oBAAoB,EAAE,QAAQ,CAAC,WAAW,EAAE,OAAO,CAe/D,CAAC"}

package/lib/exercises/math/dataRepresentations/barChart/barChartInterpreting.js

@@ -0,0 +1,543 @@
+import { addValidProp, tryToAddWrongProp, GeneratorOptionTarget, GeneratorOptionType, } from "../../../../exercises/exercise.js";
+import { random, randomMany } from "../../../../utils/alea/random.js";
+import { randfloat } from "../../../../math/utils/random/randfloat.js";
+import { blueMain, greenMain, orange, red } from "../../../../geogebra/colors.js";
+import { coinFlip } from "../../../../utils/alea/coinFlip.js";
+import { probaLawFlip } from "../../../../utils/alea/probaLawFlip.js";
+import { getDistinctQuestions } from "../../../../exercises/utils/getDistinctQuestions.js";
+import { randint } from "../../../../math/utils/random/randint.js";
+import { GeogebraConstructor } from "../../../../geogebra/geogebraConstructor.js";
+import { capitalize } from "../../../../utils/strings/capitalize.js";
+import { defaultArrayedOptsWhereNeeded } from "../../../../exercises/utils/options/arrayedOptions.js";
+class BarChartConstructor {
+    static stylesPools = {
+        color: [
+            {
+                type: "color",
+                color: blueMain,
+                frStr: "bleu",
+            },
+            {
+                type: "color",
+                color: orange,
+                frStr: "orange",
+            },
+            {
+                type: "color",
+                color: red,
+                frStr: "rouge",
+            },
+            {
+                type: "color",
+                color: greenMain,
+                frStr: "vert",
+            },
+        ],
+        fill: [
+            {
+                type: "fill",
+                fill: 1,
+                frStr: "hachures simples",
+            },
+            {
+                type: "fill",
+                fill: 2,
+                frStr: "hachures croisées",
+            },
+            {
+                type: "fill",
+                fill: 5,
+                frStr: "nid d'abeille",
+            },
+            {
+                type: "fill",
+                fill: 4,
+                frStr: "petits points",
+            },
+            {
+                type: "fill",
+                fill: 3,
+                frStr: "échiquier",
+            },
+        ],
+    };
+    static randomFromSkeleton(skeleton, nbBars, nbCateg, styleType) {
+        const categoryIndexes = randomMany([...Array(skeleton.categoryProps.length).keys()], nbCateg);
+        const dictIsUsingCategory = Object.fromEntries(categoryIndexes.map((i) => [i, true]));
+        const bars = this.createRandomBars(nbBars, dictIsUsingCategory, skeleton.barProps, skeleton.referenceData, skeleton.evoRanges).toSorted((bar1, bar2) => bar1.props.label.localeCompare(bar2.props.label));
+        const categories = this.createRandomCategories(dictIsUsingCategory, skeleton.categoryProps, styleType);
+        return {
+            description: skeleton.description,
+            axisLabels: skeleton.axisLabels,
+            bars,
+            categories,
+        };
+    }
+    static createRandomBars(nbBars, dictIsUsingCategory, barPropsPool, referenceDataIn, evoRangesIn) {
+        const barProps = randomMany(barPropsPool, nbBars);
+        function createRandomDataByPerturbatingData(data, evoRanges) {
+            return data.map((nb, i) => {
+                const evoRange = evoRanges[i];
+                return nb * randfloat(evoRange.min, evoRange.max);
+            });
+        }
+        const evoRanges = evoRangesIn.filter((_, categIndex) => dictIsUsingCategory[categIndex]);
+        let referenceData = referenceDataIn.filter((_, categIndex) => dictIsUsingCategory[categIndex]);
+        const datas = [];
+        for (let i = 0; i < nbBars; i++) {
+            const data = createRandomDataByPerturbatingData(referenceData, evoRanges);
+            datas.push(data);
+            referenceData = data;
+        }
+        return [...Array(nbBars).keys()].map((i) => {
+            return {
+                props: barProps[i],
+                data: datas[i],
+            };
+        });
+    }
+    static createRandomCategories(dictIsUsingCategory, categoryPropsPool, styleType) {
+        const nbCategUsed = Object.keys(dictIsUsingCategory).length;
+        const styles = this.stylesPools[styleType].slice(0, nbCategUsed);
+        return categoryPropsPool
+            .filter((_, i) => dictIsUsingCategory[i])
+            .map((props, i) => {
+            const style = styles[i];
+            return {
+                props,
+                style,
+            };
+        });
+    }
+}
+const frenchOrdinals = [``, "deuxième", "troisième", "quatrième"];
+const arrayOfBarChartSkeleton = [
+    {
+        description: `Le diagramme en barres ci-dessous donne la production d'électricité, en TWh (téraWatt-heure) selon son origine.`,
+        questionXForCategFunc(categName, isLess, ordinal) {
+            return `Quelle était l'année où la production d'électricité d'origine ${categName.toLocaleLowerCase()} était 
+la ${ordinal > 0 ? `${frenchOrdinals[ordinal]} la` : ``}  ${isLess ? `moins` : `plus`} importante de toutes ces années ?`;
+        },
+        answerXForCategFunc(categName, isLess, ordinal) {
+            return `l'année où la production d'électricité d'origine ${categName.toLocaleLowerCase()} était 
+la ${ordinal > 0 ? `${frenchOrdinals[ordinal]} la` : ``}  ${isLess ? `moins` : `plus`} importante de toutes ces années`;
+        },
+        questionCategForXFunc(barLabel, isLess, ordinal) {
+            return `Quelle était la ${ordinal > 0 ? `${frenchOrdinals[ordinal]}` : ``}  ${isLess ? `moins` : `plus`} importante origine de production d'électricité pour l'année $${barLabel}$ ?`;
+        },
+        answerCategForXFunc(barLabel, isLess, ordinal) {
+            return `la ${ordinal > 0 ? `${frenchOrdinals[ordinal]} la` : ``}  ${isLess ? `moins` : `plus`} importante origine de production d'électricité pour l'année $${barLabel}$`;
+        },
+        axisLabels: ["Année", "Production d'électricité (en TWh)"],
+        categoryProps: (() => {
+            const categoryNames = [
+                "Nucléaire",
+                "Thermique",
+                "Hydraulique",
+                "Solaire",
+                "Éolienne",
+            ];
+            return categoryNames.map((name) => {
+                return {
+                    name,
+                    frStr: `la production d'électricité d'origine ${name.toLocaleLowerCase()}`,
+                };
+            });
+        })(),
+        barProps: (() => {
+            const labels = [...Array(30).keys()].map((i) => `${1995 + i}`);
+            return labels.map((label) => {
+                return {
+                    label,
+                    frStr: `l'année $${label}$`,
+                };
+            });
+        })(),
+        referenceData: [500, 450, 400, 350, 300],
+        evoRanges: [
+            { min: 0.95, max: 1.05 },
+            { min: 0.9, max: 1.1 },
+            { min: 0.8, max: 1.2 },
+            { min: 0.7, max: 1.3 },
+            { min: 0.7, max: 1.3 },
+        ],
+    },
+];
+const getInstruction = (identifiers) => {
+    const { barChart, questionStr } = identifiers;
+    return `${barChart.description}
+  
+${questionStr}
+
+Légende :
+
+${barChart.categories
+        .map((category) => {
+        return `${category.props.name} (${category.style.frStr})
+
+`;
+    })
+        .join("")}
+`;
+};
+const getAnswerCategory = (barChart, itemAsked) => {
+    const bar = barChart.bars[itemAsked.index];
+    const categIndex = bar.data
+        .map((data, i) => {
+        return { data: data, categIndex: i };
+    })
+        .toSorted((obj1, obj2) => (itemAsked.isLess ? +1 : -1) * (obj1.data - obj2.data))[itemAsked.ordinal].categIndex;
+    return barChart.categories[categIndex];
+};
+const getAnswerBar = (barChart, itemAsked) => {
+    const categIndex = itemAsked.index;
+    const barIndex = barChart.bars
+        .map((bar) => bar.data[categIndex])
+        .map((data, i) => {
+        return { data: data, barIndex: i };
+    })
+        .toSorted((obj1, obj2) => (itemAsked.isLess ? +1 : -1) * (obj1.data - obj2.data))[itemAsked.ordinal].barIndex;
+    return barChart.bars[barIndex];
+};
+const getAnswer = (identifiers) => {
+    const { barChart, itemAsked } = identifiers;
+    switch (itemAsked.type) {
+        case "categoryForX":
+            return getAnswerCategory(barChart, itemAsked).props.name;
+        case "xForCategory":
+            return getAnswerBar(barChart, itemAsked).props.label;
+    }
+};
+const getPropositions = (_, { answer, ...identifiers }) => {
+    const { barChart, itemAsked } = identifiers;
+    const propositions = [];
+    switch (itemAsked.type) {
+        case "categoryForX":
+            {
+                barChart.categories.forEach((categ) => {
+                    if (categ.props.name === answer) {
+                        addValidProp(propositions, categ.props.name, "raw");
+                    }
+                    else {
+                        tryToAddWrongProp(propositions, categ.props.name, "raw");
+                    }
+                });
+            }
+            break;
+        case "xForCategory":
+            {
+                barChart.bars.forEach((bar) => {
+                    if (bar.props.label === answer) {
+                        addValidProp(propositions, bar.props.label, "raw");
+                    }
+                    else {
+                        tryToAddWrongProp(propositions, bar.props.label, "raw");
+                    }
+                });
+            }
+            break;
+    }
+    return propositions;
+};
+const getHint = (identifiers) => {
+    const { barChart, itemAsked } = identifiers;
+    switch (itemAsked.type) {
+        case "categoryForX": {
+            const bar = barChart.bars[itemAsked.index];
+            return `Concentre-toi sur ${bar.props.frStr}.`;
+        }
+        case "xForCategory": {
+            const category = barChart.categories[itemAsked.index];
+            return `Concentre-toi sur les barres ${category.style.type === "color"
+                ? `en ${category.style.frStr}`
+                : `en style ${category.style.frStr}`}.`;
+        }
+    }
+};
+const getCorrection = (identifiers) => {
+    const { barChart, itemAsked, answerStr } = identifiers;
+    switch (itemAsked.type) {
+        case "categoryForX": {
+            const answerCategory = getAnswerCategory(barChart, itemAsked);
+            return `On cherche ${answerStr}. 
+      ${capitalize(answerStr)} est ${answerCategory.props.frStr}.`;
+        }
+        case "xForCategory": {
+            const category = barChart.categories[itemAsked.index];
+            const answerBar = getAnswerBar(barChart, itemAsked);
+            return `Comme ${category.props.frStr} est indiquée ${category.style.type === "color"
+                ? `en ${category.style.frStr}`
+                : `en style ${category.style.frStr}`} sur le diagramme , on cherche ${answerStr}. 
+      ${capitalize(answerStr)} est ${answerBar.props.frStr}.`;
+        }
+    }
+};
+const getGGBOptionsHorizMulti = (identifiers) => {
+    const { barChart } = identifiers;
+    const nbTotalBar = barChart.bars.length;
+    const nbTotalCateg = barChart.categories.length;
+    const yMax = Math.max(...barChart.bars.flatMap((bar) => bar.data));
+    const xMax = 3.0 * yMax;
+    function getXRangeForCategory(barIndex, categIndex) {
+        const xRangeBar = {
+            min: (xMax * (2 * barIndex + 1)) / (2 * nbTotalBar + 2),
+            max: (xMax * (2 * barIndex + 2)) / (2 * nbTotalBar + 2),
+        };
+        const progressMin = categIndex / (nbTotalCateg + 1);
+        const progressMax = (categIndex + 1) / (nbTotalCateg + 1);
+        return {
+            min: xRangeBar.min + progressMin * (xRangeBar.max - xRangeBar.min),
+            max: xRangeBar.min + progressMax * (xRangeBar.max - xRangeBar.min),
+        };
+    }
+    function createBarChartCommandsForCategory(barChart, categIndex) {
+        const arrayXRange = barChart.bars.map((_, barIndex) => getXRangeForCategory(barIndex, categIndex));
+        const arrayX = arrayXRange.map((xRange) => xRange.min);
+        const arrayY = barChart.bars.map((bar) => bar.data[categIndex]);
+        const categ = barChart.categories[categIndex];
+        const style = categ.style;
+        const B = `B_${categIndex}`;
+        const barChartCommand = [
+            `${B} = BarChart({${arrayX.join(",")}}, {${arrayY.join(",")}}, ${xMax / ((2 * nbTotalBar + 2) * (nbTotalCateg + 1))})`,
+            `ShowLabel(${B},false)`,
+            style.type === "color"
+                ? `SetColor(${B}, "${barChart.categories[categIndex].style.color}")`
+                : `SetDecoration(${B}, ${barChart.categories[categIndex].style.fill})`,
+        ];
+        return barChartCommand;
+    }
+    const commands = [
+        //offsetted barCharts
+        ...barChart.categories.flatMap((_, categIndex) => createBarChartCommandsForCategory(barChart, categIndex)),
+        //bar labels
+        ...barChart.bars.map((bar, barIndex) => `Text("\\footnotesize ${bar.props.label}", (${(xMax * (2 * barIndex + 1)) / (2 * nbTotalBar + 2)}, ${-yMax / 500}), true, true, 0, -1)`),
+    ];
+    const ggb = new GeogebraConstructor({
+        commands,
+        gridDistance: [xMax, yMax],
+        fontSize: 16,
+        lockedAxesRatio: 4 / 3,
+        xAxis: {
+            hideNumbers: true,
+            steps: 10 * xMax,
+            showPositive: true,
+            label: barChart.axisLabels[0],
+        },
+        yAxis: {
+            showPositive: true,
+            label: barChart.axisLabels[1],
+            //   steps: 100,
+        },
+    });
+    return ggb.getOptions({
+        coords: ggb.getAdaptedCoords({
+            xMin: 0,
+            xMax: xMax,
+            yMin: 0,
+            yMax: yMax,
+        }),
+    });
+};
+const getGGBOptionsVertStacked = (identifiers) => {
+    const { barChart } = identifiers;
+    const nbTotalBar = barChart.bars.length;
+    const arrayOfBarHeights = barChart.bars.map((bar) => bar.data.reduce((acc, data) => acc + data, 0));
+    const yMax = Math.max(...arrayOfBarHeights);
+    const xMax = 3.0 * yMax;
+    const xPadding = 0.1 * xMax;
+    const xMargin = xPadding;
+    const barWidth = (xMax - 2 * xMargin - (nbTotalBar - 1) * xPadding) / nbTotalBar;
+    function getXRangeForBarIndex(barIndex) {
+        const xMin = xMargin + barIndex * (xPadding + barWidth);
+        return {
+            min: xMin,
+            max: xMin + barWidth,
+        };
+    }
+    function getYRangeForCategory(barIndex, categIndex, isTopToBottom = true) {
+        const slice = barChart.bars[barIndex].data.slice(0, categIndex);
+        const yMinForCateg = slice.reduce((acc, data) => acc + data, 0);
+        const yMaxForCateg = yMinForCateg + barChart.bars[barIndex].data[categIndex];
+        return {
+            min: isTopToBottom
+                ? arrayOfBarHeights[barIndex] - yMinForCateg
+                : yMinForCateg,
+            max: isTopToBottom
+                ? arrayOfBarHeights[barIndex] - yMaxForCateg
+                : yMaxForCateg,
+        };
+    }
+    function createCommandsForBar(barChart, barIndex) {
+        //const bar = barChart.bars[barIndex];
+        const commands = barChart.categories.flatMap((categ, categIndex) => {
+            const xRange = getXRangeForBarIndex(barIndex);
+            const yRange = getYRangeForCategory(barIndex, categIndex, true);
+            const style = categ.style;
+            const B = `B_{${barIndex}${categIndex}}`;
+            const barChartCommand = [
+                `${B} = Polygon((${xRange.min}, ${yRange.min}), (${xRange.min}, ${yRange.max}),(${xRange.max}, ${yRange.max}),(${xRange.max}, ${yRange.min}))`,
+                `ShowLabel(${B},false)`,
+                style.type === "color"
+                    ? `SetColor(${B}, "${categ.style.color}")`
+                    : `SetDecoration(${B}, ${categ.style.fill})`,
+            ];
+            return barChartCommand;
+        });
+        return commands;
+    }
+    const commands = [
+        //stacked bars
+        ...barChart.bars.flatMap((_, barIndex) => createCommandsForBar(barChart, barIndex)),
+        //bar labels
+        ...barChart.bars.map((bar, barIndex) => `Text("\\footnotesize ${bar.props.label}", (${getXRangeForBarIndex(barIndex).min}, ${-yMax / 500}), true, true, 0, -1)`),
+    ];
+    const ggb = new GeogebraConstructor({
+        commands,
+        gridDistance: [xMax, yMax],
+        fontSize: 16,
+        lockedAxesRatio: 4 / 3,
+        xAxis: {
+            hideNumbers: true,
+            steps: 10 * xMax,
+            showPositive: true,
+            label: barChart.axisLabels[0],
+        },
+        yAxis: {
+            showPositive: true,
+            label: barChart.axisLabels[1],
+            //   steps: 100,
+        },
+    });
+    return ggb.getOptions({
+        coords: ggb.getAdaptedCoords({
+            xMin: 0,
+            xMax: xMax,
+            yMin: 0,
+            yMax: yMax,
+        }),
+    });
+};
+const getGGBOptions = (identifiers, opts) => {
+    const { displayType } = identifiers;
+    switch (displayType) {
+        case "empilements":
+            return getGGBOptionsVertStacked(identifiers, opts);
+        default:
+        case "faisceaux":
+            return getGGBOptionsHorizMulti(identifiers, opts);
+    }
+};
+const getBarChartInterpretingQuestion = (optsIn) => {
+    const arrayedOpts = defaultArrayedOptsWhereNeeded(optsIn, arrayedOptsDefault);
+    const opts = {
+        displayType: random(arrayedOpts.displayType),
+    };
+    const styleType = "color";
+    const displayType = opts.displayType;
+    let nbBars;
+    let nbCateg;
+    switch (displayType) {
+        case "empilements":
+            {
+                nbBars = 5;
+                nbCateg = 3;
+            }
+            break;
+        default:
+        case "faisceaux":
+            {
+                nbBars = 3;
+                nbCateg = 3;
+            }
+            break;
+    }
+    const barChartSkeleton = random(arrayOfBarChartSkeleton);
+    const barChart = BarChartConstructor.randomFromSkeleton(barChartSkeleton, nbBars, nbCateg, styleType);
+    const itemAsked = random([
+        // {
+        //   type: "xForCategory",
+        //   isLess: coinFlip(),
+        //   ordinal: probaLawFlip([
+        //     [0, 0.7],
+        //     [1, 0.3],
+        //   ]),
+        //   index: randint(0, nbCateg),
+        // },
+        {
+            type: "categoryForX",
+            isLess: coinFlip(),
+            ordinal: probaLawFlip([
+                [0, 0.7],
+                [1, 0.3],
+            ]),
+            index: randint(0, nbBars),
+        },
+    ]);
+    function questionStrForItemAsked(itemAsked) {
+        switch (itemAsked.type) {
+            case "xForCategory":
+                return barChartSkeleton.questionXForCategFunc(barChart.categories[itemAsked.index].props.name, itemAsked.isLess, itemAsked.ordinal);
+            case "categoryForX":
+                return barChartSkeleton.questionCategForXFunc(barChart.bars[itemAsked.index].props.label, itemAsked.isLess, itemAsked.ordinal);
+        }
+    }
+    const questionStr = questionStrForItemAsked(itemAsked);
+    function answerStrForItemAsked(itemAsked) {
+        switch (itemAsked.type) {
+            case "xForCategory":
+                return barChartSkeleton.answerXForCategFunc(barChart.categories[itemAsked.index].props.name, itemAsked.isLess, itemAsked.ordinal);
+            case "categoryForX":
+                return barChartSkeleton.answerCategForXFunc(barChart.bars[itemAsked.index].props.label, itemAsked.isLess, itemAsked.ordinal);
+        }
+    }
+    const answerStr = answerStrForItemAsked(itemAsked);
+    return getQuestionFromIdentifiers({
+        barChart,
+        itemAsked,
+        questionStr,
+        answerStr,
+        displayType,
+    }, opts);
+};
+const getQuestionFromIdentifiers = (identifiers, opts) => {
+    const question = {
+        answer: getAnswer(identifiers),
+        instruction: getInstruction(identifiers),
+        keys: [],
+        answerFormat: "tex",
+        identifiers,
+        hint: getHint(identifiers),
+        correction: getCorrection(identifiers),
+        ggbOptions: getGGBOptions(identifiers),
+        options: opts,
+    };
+    return question;
+};
+const arrayedOptsDefault = {
+    displayType: ["faisceaux", "empilements"],
+};
+const options = [
+    {
+        id: "displayType",
+        label: "Type de diagramme",
+        target: GeneratorOptionTarget.generation,
+        type: GeneratorOptionType.multiselect,
+        values: ["faisceaux", "empilements"],
+        defaultValue: arrayedOptsDefault.displayType,
+    },
+];
+export const barChartInterpreting = {
+    id: "barChartInterpreting",
+    label: "Interpréter un diagramme en bâtons",
+    isSingleStep: true,
+    generator: (nb, opts) => getDistinctQuestions(() => getBarChartInterpretingQuestion(opts), nb),
+    options,
+    qcmTimer: 60,
+    freeTimer: 60,
+    getPropositions,
+    hasHintAndCorrection: true,
+    subject: "Mathématiques",
+    getQuestionFromIdentifiers,
+    hasGeogebra: true,
+    answerType: "QCU",
+};

package/lib/exercises/math/dataRepresentations/barChart/barChartReading.d.ts

@@ -0,0 +1,94 @@
+import { Exercise } from "../../../../exercises/exercise.js";
+type Identifiers = {
+    labels: string[];
+    data: number[];
+    itemAsked: number;
+};
+export declare const barChartReading: Exercise<Identifiers>;
+export {};
+/***Final version */
+/**
+ *
+ *   const newspapers = [
+    { name: "Le Figaro", sales: 320000 },
+    { name: "Les Échos", sales: 130000 },
+    { name: "La Croix", sales: 90000 },
+    { name: "L'Équipe", sales: 210000 },
+    { name: "Le Monde", sales: 330000 },
+    { name: "Le Parisien", sales: 270000 },
+    { name: "Libération", sales: 70000 },
+    { name: "L'Humanité", sales: 30000 },
+  ];
+
+  const width = 600,
+    height = 400,
+    margin = { top: 20, right: 30, bottom: 100, left: 60 };
+  const d3n = new D3Node();
+  const d3 = d3n.d3;
+
+  const svg = d3n.createSVG(width, height);
+
+  const xScale = d3
+    .scaleBand()
+    .domain(newspapers.map((d) => d.name))
+    .range([margin.left, width - margin.right])
+    .padding(0.1);
+
+  const yScale = d3
+    .scaleLinear()
+    .domain([0, d3.max(newspapers, (d: any) => d.sales)])
+    .nice()
+    .range([height - margin.bottom, margin.top]);
+
+  svg
+    .append("g")
+    .attr("transform", `translate(0,${height - margin.bottom})`)
+    .call(d3.axisBottom(xScale).tickSize(0))
+    .selectAll("text")
+    .style("text-anchor", "end")
+    .attr("transform", "rotate(-30)");
+
+  svg
+    .append("g")
+    .attr("transform", `translate(${margin.left},0)`)
+    .call(
+      d3
+        .axisLeft(yScale)
+        .ticks(5)
+        .tickFormat((d: any) =>
+          d.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " "),
+        ),
+    );
+
+  svg
+    .append("text")
+    .attr("x", margin.left)
+    .attr("y", margin.top)
+    .attr("text-anchor", "start")
+    .style("font-size", "14px")
+    .style("font-weight", "bold")
+    .text("Nombre d'exemplaires vendus");
+
+  svg
+    .selectAll(".bar")
+    .data(newspapers)
+    .enter()
+    .append("rect")
+    .attr("class", "bar")
+    .attr("x", (d: any) => xScale(d.name))
+    .attr("y", (d: any) => yScale(d.sales))
+    .attr("width", xScale.bandwidth())
+    .attr("height", (d: any) => height - margin.bottom - yScale(d.sales))
+    .attr("fill", "steelblue");
+
+  const svgString = d3n.svgString();
+  return `BBteeeezfst :
+
+  ofzie
+  should read this
+${svgString}
+  should read this
+zef
+`;
+ */
+//# sourceMappingURL=barChartReading.d.ts.map

package/lib/exercises/math/dataRepresentations/barChart/barChartReading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"barChartReading.d.ts","sourceRoot":"","sources":["../../../../../src/exercises/math/dataRepresentations/barChart/barChartReading.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EAiBT,MAAM,6BAA6B,CAAC;AAOrC,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAwIF,eAAO,MAAM,eAAe,EAAE,QAAQ,CAAC,WAAW,CAgBjD,CAAC;;AAgFF,oBAAoB;AACpB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmFG"}