svg alignemment
This commit is contained in:
98
SVG_CONTENT_ARCHITECTURE.md
Normal file
98
SVG_CONTENT_ARCHITECTURE.md
Normal file
@@ -0,0 +1,98 @@
|
||||
# Architecture des contenus SVG pédagogiques
|
||||
|
||||
## Diagnostic
|
||||
|
||||
Le problème des traits de fraction n'est pas un simple défaut ponctuel de mise en page.
|
||||
Les retours du 2026-05-07 montrent le même motif sur plusieurs supports fractions :
|
||||
|
||||
- traits obliques à proscrire pour les élèves de CM1 ;
|
||||
- barres horizontales qui recouvrent le numérateur ou le dénominateur ;
|
||||
- expressions de fractions qui se chevauchent dans les équations ;
|
||||
- corrections faites directement dans les SVG finaux.
|
||||
|
||||
L'architecture actuelle sait charger, servir, recadrer et relire des SVG. Elle ne sait pas garantir que les objets mathématiques dessinés à l'intérieur du SVG sont corrects.
|
||||
|
||||
## État actuel
|
||||
|
||||
- Les contenus sont stockés comme fichiers SVG finaux dans `backend/contenus_pedagogiques`.
|
||||
- Le backend expose les SVG tels quels via `/program/assets/{asset_token}`.
|
||||
- Le découpage en cards est fait par détection de grands groupes `<g>` dans `backend/app/program_content.py`.
|
||||
- Les retours de validation sont stockés séparément dans `review_updates`.
|
||||
- Les SVG fractions récents utilisent déjà une convention locale : `math-expression` et `fraction-g`.
|
||||
|
||||
Cette convention est utile, mais elle arrive trop tard : elle est écrite dans le SVG produit, sans source structurée, sans composant unique et sans validation automatique.
|
||||
|
||||
## Décision recommandée
|
||||
|
||||
Garder SVG comme format de sortie, mais ne plus considérer le SVG final comme la source principale pour les objets mathématiques sensibles.
|
||||
|
||||
Pour les prochaines générations, il faut ajouter une couche intermédiaire :
|
||||
|
||||
1. Une source structurée décrivant les cards et les objets pédagogiques.
|
||||
2. Une petite bibliothèque de primitives SVG contrôlées.
|
||||
3. Un validateur automatique lancé après génération.
|
||||
4. Une revue humaine uniquement sur les points que l'automatique ne peut pas juger.
|
||||
|
||||
## Primitive prioritaire : fraction verticale
|
||||
|
||||
Une fraction ne doit plus être écrite à la main dans un SVG.
|
||||
|
||||
La primitive `fraction(numerateur, denominateur, options)` doit produire :
|
||||
|
||||
- un groupe `<g class="math-expression fraction-g" data-math="fraction">` ;
|
||||
- deux textes centrés ;
|
||||
- une barre horizontale ;
|
||||
- des espacements calculés depuis la taille de police ;
|
||||
- une largeur calculée depuis le plus long texte ;
|
||||
- aucun trait oblique pour les fractions CM1 ;
|
||||
- une boîte logique exportable, pour éviter les collisions dans les équations.
|
||||
|
||||
Règle de rendu CM1 :
|
||||
|
||||
- fraction verticale obligatoire ;
|
||||
- barre horizontale visible et séparée des chiffres ;
|
||||
- pas de notation `3/4` dans les SVG destinés à l'élève, sauf dans les notes Markdown ou les contextes de card.
|
||||
|
||||
## Validation automatique minimale
|
||||
|
||||
Le validateur doit refuser ou signaler :
|
||||
|
||||
- texte SVG contenant une fraction oblique du type `3/4` ;
|
||||
- groupe `fraction-g` sans numérateur, barre et dénominateur ;
|
||||
- barre qui n'est pas située entre les deux textes ;
|
||||
- espacement vertical trop faible autour de la barre ;
|
||||
- barre trop courte par rapport aux chiffres ;
|
||||
- SVG sans `viewBox` ou dimensions incohérentes ;
|
||||
- card sans grand rectangle détectable, quand elle doit être découpée.
|
||||
|
||||
Le premier filet de sécurité est disponible dans `backend/tools/validate_svg_quality.py`.
|
||||
|
||||
## Architecture cible courte
|
||||
|
||||
À court terme :
|
||||
|
||||
- continuer à servir les SVG existants ;
|
||||
- imposer `fraction-g` pour toutes les fractions verticales ;
|
||||
- lancer `python backend/tools/validate_svg_quality.py backend/contenus_pedagogiques` après chaque génération ;
|
||||
- corriger les fichiers signalés avant revue utilisateur.
|
||||
|
||||
À moyen terme :
|
||||
|
||||
- générer les SVG depuis des descriptions structurées, par exemple `*.content.json` ou `*.content.yaml` ;
|
||||
- centraliser les primitives dans un module de génération ;
|
||||
- faire produire aux agents du contenu structuré plutôt que du SVG brut ;
|
||||
- rendre le SVG final reproductible à partir de la source.
|
||||
|
||||
À long terme :
|
||||
|
||||
- ajouter une capture raster automatique en CI pour détecter les chevauchements visuels réels ;
|
||||
- comparer certains rendus à des snapshots de référence ;
|
||||
- étendre les primitives aux droites graduées, bandes partagées, tableaux de nombres, zones de réponse et schémas en barres.
|
||||
|
||||
## Évaluation
|
||||
|
||||
L'architecture actuelle est acceptable pour afficher et relire des supports déjà produits.
|
||||
Elle n'est pas suffisante pour produire régulièrement des contenus mathématiques propres.
|
||||
|
||||
La bonne direction n'est pas de remplacer SVG, mais de déplacer l'intelligence avant le SVG final : composants mathématiques, contraintes géométriques, validation automatique, puis rendu.
|
||||
|
||||
@@ -1,10 +1,85 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:54px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:22px;fill:#2d4148}.frac{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:72px;font-weight:800;fill:#074f4b}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.blue{fill:#1d78b5}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/>
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:54px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:22px;fill:#2d4148}.frac{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:72px;font-weight:800;fill:#074f4b}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.blue{fill:#1d78b5}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Exercices - Lire et écrire une fraction</text>
|
||||
<g transform="translate(110 190)"><rect width="430" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">1. Lis les fractions</text><g class="math-expression"><g transform="translate(70 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="frac">1</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="frac">2</text></g></g><g class="math-expression"><g transform="translate(70 235)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="frac">3</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="frac">4</text></g></g><g class="math-expression"><g transform="translate(70 325)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="frac">5</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="frac">8</text></g></g><g class="math-expression"><g transform="translate(70 415)" class="fraction-g"><text x="25.3" y="-15.64" text-anchor="middle" class="frac">7</text><line x1="0" y1="1.84" x2="50.6" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="25.3" y="26.68" text-anchor="middle" class="frac">10</text></g></g><line x1="230" y1="145" x2="375" y2="145" class="blank"/><line x1="230" y1="235" x2="375" y2="235" class="blank"/><line x1="230" y1="325" x2="375" y2="325" class="blank"/><line x1="250" y1="415" x2="375" y2="415" class="blank"/></g>
|
||||
<g transform="translate(590 190)"><rect width="430" height="560" rx="24" class="panel"/><text x="32" y="58" class="h2">2. Haut et bas</text><g class="math-expression"><g transform="translate(58 135)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="frac">2</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="frac">5</text></g></g><g class="math-expression"><g transform="translate(58 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="frac">4</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="frac">9</text></g></g><g class="math-expression"><g transform="translate(58 375)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="frac">6</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="frac">7</text></g></g><text x="210" y="120" class="small">Numérateur :</text><line x1="210" y1="155" x2="370" y2="155" class="blank"/><text x="210" y="205" class="small">Dénominateur :</text><line x1="210" y1="240" x2="370" y2="240" class="blank"/><text x="210" y="325" class="small">Recommence pour les autres.</text></g>
|
||||
<g transform="translate(1070 190)"><rect width="420" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">3. Écris en chiffres</text><text x="45" y="140" class="body">deux tiers</text><line x1="45" y1="180" x2="340" y2="180" class="blank"/><text x="45" y="255" class="body">trois cinquièmes</text><line x1="45" y1="295" x2="340" y2="295" class="blank"/><text x="45" y="370" class="body">neuf dixièmes</text><line x1="45" y1="410" x2="340" y2="410" class="blank"/><text x="45" y="500" class="small">Explique avec unité et parts.</text></g>
|
||||
<g transform="translate(110 190)">
|
||||
<rect width="430" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">1. Lis les fractions</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(70 145)" class="fraction-g">
|
||||
<text x="29" y="-30" text-anchor="middle" class="frac">1</text>
|
||||
<line x1="0" y1="5" x2="58" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="29" y="56" text-anchor="middle" class="frac">2</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(70 235)" class="fraction-g">
|
||||
<text x="29" y="-30" text-anchor="middle" class="frac">3</text>
|
||||
<line x1="0" y1="5" x2="58" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="29" y="56" text-anchor="middle" class="frac">4</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(70 325)" class="fraction-g">
|
||||
<text x="29" y="-30" text-anchor="middle" class="frac">5</text>
|
||||
<line x1="0" y1="5" x2="58" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="29" y="56" text-anchor="middle" class="frac">8</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(70 415)" class="fraction-g">
|
||||
<text x="48" y="-30" text-anchor="middle" class="frac">7</text>
|
||||
<line x1="0" y1="5" x2="96" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="48" y="56" text-anchor="middle" class="frac">10</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="230" y1="145" x2="375" y2="145" class="blank" />
|
||||
<line x1="230" y1="235" x2="375" y2="235" class="blank" />
|
||||
<line x1="230" y1="325" x2="375" y2="325" class="blank" />
|
||||
<line x1="250" y1="415" x2="375" y2="415" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(590 190)">
|
||||
<rect width="430" height="560" rx="24" class="panel" />
|
||||
<text x="32" y="58" class="h2">2. Haut et bas</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(58 135)" class="fraction-g">
|
||||
<text x="29" y="-30" text-anchor="middle" class="frac">2</text>
|
||||
<line x1="0" y1="5" x2="58" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="29" y="56" text-anchor="middle" class="frac">5</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(58 255)" class="fraction-g">
|
||||
<text x="29" y="-30" text-anchor="middle" class="frac">4</text>
|
||||
<line x1="0" y1="5" x2="58" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="29" y="56" text-anchor="middle" class="frac">9</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(58 375)" class="fraction-g">
|
||||
<text x="29" y="-30" text-anchor="middle" class="frac">6</text>
|
||||
<line x1="0" y1="5" x2="58" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="29" y="56" text-anchor="middle" class="frac">7</text>
|
||||
</g>
|
||||
</g>
|
||||
<text x="210" y="120" class="small">Numérateur :</text>
|
||||
<line x1="210" y1="155" x2="370" y2="155" class="blank" />
|
||||
<text x="210" y="205" class="small">Dénominateur :</text>
|
||||
<line x1="210" y1="240" x2="370" y2="240" class="blank" />
|
||||
<text x="210" y="325" class="small">Recommence pour les autres.</text>
|
||||
</g>
|
||||
<g transform="translate(1070 190)">
|
||||
<rect width="420" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">3. Écris en chiffres</text>
|
||||
<text x="45" y="140" class="body">deux tiers</text>
|
||||
<line x1="45" y1="180" x2="340" y2="180" class="blank" />
|
||||
<text x="45" y="255" class="body">trois cinquièmes</text>
|
||||
<line x1="45" y1="295" x2="340" y2="295" class="blank" />
|
||||
<text x="45" y="370" class="body">neuf dixièmes</text>
|
||||
<line x1="45" y1="410" x2="340" y2="410" class="blank" />
|
||||
<text x="45" y="500" class="small">Explique avec unité et parts.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 4.6 KiB After Width: | Height: | Size: 5.0 KiB |
@@ -1,9 +1,64 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:54px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:22px;fill:#2d4148}.line{stroke:#26383d;stroke-width:4}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.green{fill:#2f9246}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:54px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:22px;fill:#2d4148}.line{stroke:#26383d;stroke-width:4}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.green{fill:#2f9246}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Exercices - Représenter une fraction</text>
|
||||
<g transform="translate(110 190)"><rect width="430" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">1. Quelle fraction ?</text><text x="45" y="115" class="body">2 parts sur 3</text><line x1="45" y1="150" x2="340" y2="150" class="blank"/><text x="45" y="225" class="body">4 parts sur 5</text><line x1="45" y1="260" x2="340" y2="260" class="blank"/><text x="45" y="335" class="body">6 parts sur 10</text><line x1="45" y1="370" x2="340" y2="370" class="blank"/></g>
|
||||
<g transform="translate(590 190)"><rect width="430" height="560" rx="24" class="panel"/><g class="math-expression"><text x="32" y="58" class="h2">2. Colorie </text><g transform="translate(204.48 58)" class="fraction-g"><text x="14" y="-9.52" text-anchor="middle" class="h2">3</text><line x1="0" y1="1.12" x2="28" y2="1.12" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="16.24" text-anchor="middle" class="h2">6</text></g></g><g transform="translate(50 145)"><rect width="330" height="95" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><line x1="55" y1="0" x2="55" y2="95" class="line"/><line x1="110" y1="0" x2="110" y2="95" class="line"/><line x1="165" y1="0" x2="165" y2="95" class="line"/><line x1="220" y1="0" x2="220" y2="95" class="line"/><line x1="275" y1="0" x2="275" y2="95" class="line"/></g><text x="50" y="315" class="body">Puis explique :</text><text x="50" y="365" class="small">Dénominateur =</text><line x1="220" y1="365" x2="365" y2="365" class="blank"/><text x="50" y="430" class="small">Numérateur =</text><line x1="220" y1="430" x2="365" y2="430" class="blank"/></g>
|
||||
<g transform="translate(1070 190)"><rect width="420" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">3. Collection</text><text x="45" y="112" class="body">12 jetons, 5 rouges</text><g transform="translate(65 170)"><circle cx="0" cy="0" r="18" class="green"/><circle cx="52" cy="0" r="18" class="green"/><circle cx="104" cy="0" r="18" class="green"/><circle cx="156" cy="0" r="18" class="green"/><circle cx="208" cy="0" r="18" class="green"/><circle cx="260" cy="0" r="18" fill="#e8f3ee" stroke="#26383d"/><circle cx="0" cy="65" r="18" fill="#e8f3ee" stroke="#26383d"/><circle cx="52" cy="65" r="18" fill="#e8f3ee" stroke="#26383d"/><circle cx="104" cy="65" r="18" fill="#e8f3ee" stroke="#26383d"/><circle cx="156" cy="65" r="18" fill="#e8f3ee" stroke="#26383d"/><circle cx="208" cy="65" r="18" fill="#e8f3ee" stroke="#26383d"/><circle cx="260" cy="65" r="18" fill="#e8f3ee" stroke="#26383d"/></g><text x="45" y="340" class="body">Fraction rouge :</text><line x1="45" y1="390" x2="340" y2="390" class="blank"/><text x="45" y="480" class="small">Les parts doivent etre égales.</text></g>
|
||||
<g transform="translate(110 190)">
|
||||
<rect width="430" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">1. Quelle fraction ?</text>
|
||||
<text x="45" y="115" class="body">2 parts sur 3</text>
|
||||
<line x1="45" y1="150" x2="340" y2="150" class="blank" />
|
||||
<text x="45" y="225" class="body">4 parts sur 5</text>
|
||||
<line x1="45" y1="260" x2="340" y2="260" class="blank" />
|
||||
<text x="45" y="335" class="body">6 parts sur 10</text>
|
||||
<line x1="45" y1="370" x2="340" y2="370" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(590 190)">
|
||||
<rect width="430" height="560" rx="24" class="panel" />
|
||||
<g class="math-expression">
|
||||
<text x="32" y="58" class="h2">2. Colorie </text>
|
||||
<g transform="translate(204.48 58)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">3</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">6</text>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(50 145)">
|
||||
<rect width="330" height="95" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<line x1="55" y1="0" x2="55" y2="95" class="line" />
|
||||
<line x1="110" y1="0" x2="110" y2="95" class="line" />
|
||||
<line x1="165" y1="0" x2="165" y2="95" class="line" />
|
||||
<line x1="220" y1="0" x2="220" y2="95" class="line" />
|
||||
<line x1="275" y1="0" x2="275" y2="95" class="line" />
|
||||
</g>
|
||||
<text x="50" y="315" class="body">Puis explique :</text>
|
||||
<text x="50" y="365" class="small">Dénominateur =</text>
|
||||
<line x1="220" y1="365" x2="365" y2="365" class="blank" />
|
||||
<text x="50" y="430" class="small">Numérateur =</text>
|
||||
<line x1="220" y1="430" x2="365" y2="430" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(1070 190)">
|
||||
<rect width="420" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">3. Collection</text>
|
||||
<text x="45" y="112" class="body">12 jetons, 5 rouges</text>
|
||||
<g transform="translate(65 170)">
|
||||
<circle cx="0" cy="0" r="18" class="green" />
|
||||
<circle cx="52" cy="0" r="18" class="green" />
|
||||
<circle cx="104" cy="0" r="18" class="green" />
|
||||
<circle cx="156" cy="0" r="18" class="green" />
|
||||
<circle cx="208" cy="0" r="18" class="green" />
|
||||
<circle cx="260" cy="0" r="18" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="0" cy="65" r="18" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="52" cy="65" r="18" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="104" cy="65" r="18" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="156" cy="65" r="18" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="208" cy="65" r="18" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="260" cy="65" r="18" fill="#e8f3ee" stroke="#26383d" />
|
||||
</g>
|
||||
<text x="45" y="340" class="body">Fraction rouge :</text>
|
||||
<line x1="45" y1="390" x2="340" y2="390" class="blank" />
|
||||
<text x="45" y="480" class="small">Les parts doivent etre égales.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 3.9 KiB |
@@ -1,7 +1,53 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:21px;fill:#2d4148}.axis{stroke:#26383d;stroke-width:5;stroke-linecap:round}.tick{stroke:#26383d;stroke-width:4}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/><text x="800" y="116" text-anchor="middle" class="title">Exercices - Fraction sur demi-droite</text>
|
||||
<g transform="translate(115 200)"><rect width="1370" height="260" rx="24" class="soft"/><g class="math-expression"><text x="36" y="58" class="h2">1. Place </text><g transform="translate(177.12 58)" class="fraction-g"><text x="14" y="-9.52" text-anchor="middle" class="h2">3</text><line x1="0" y1="1.12" x2="28" y2="1.12" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="16.24" text-anchor="middle" class="h2">4</text></g></g><line x1="130" y1="155" x2="640" y2="155" class="axis"/><polygon points="640,155 610,138 610,172" fill="#26383d"/><g transform="translate(130 0)"><line x1="0" y1="125" x2="0" y2="185" class="tick"/><text x="0" y="220" text-anchor="middle" class="body">0</text><line x1="120" y1="135" x2="120" y2="175" class="tick"/><line x1="240" y1="135" x2="240" y2="175" class="tick"/><line x1="360" y1="135" x2="360" y2="175" class="tick"/><line x1="480" y1="125" x2="480" y2="185" class="tick"/><text x="480" y="220" text-anchor="middle" class="body">1</text></g><text x="760" y="125" class="body">Unité partagée en 4 parts.</text><text x="760" y="180" class="body">Avance de combien de parts ?</text><line x1="1090" y1="180" x2="1260" y2="180" class="blank"/></g>
|
||||
<g transform="translate(115 520)"><rect width="1370" height="230" rx="24" class="panel"/><text x="36" y="58" class="h2">2. Lis le point</text><line x1="130" y1="145" x2="640" y2="145" class="axis"/><polygon points="640,145 610,128 610,162" fill="#26383d"/><g transform="translate(130 0)"><line x1="0" y1="115" x2="0" y2="175" class="tick"/><text x="0" y="210" text-anchor="middle" class="body">0</text><line x1="96" y1="125" x2="96" y2="165" class="tick"/><line x1="192" y1="125" x2="192" y2="165" class="tick"/><circle cx="192" cy="145" r="16" class="orange"/><line x1="288" y1="125" x2="288" y2="165" class="tick"/><line x1="384" y1="125" x2="384" y2="165" class="tick"/><line x1="480" y1="115" x2="480" y2="175" class="tick"/><text x="480" y="210" text-anchor="middle" class="body">1</text></g><text x="760" y="125" class="body">L'unité est en 5 parts.</text><text x="760" y="180" class="body">Le point indique :</text><line x1="980" y1="180" x2="1260" y2="180" class="blank"/></g>
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:21px;fill:#2d4148}.axis{stroke:#26383d;stroke-width:5;stroke-linecap:round}.tick{stroke:#26383d;stroke-width:4}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Exercices - Fraction sur demi-droite</text>
|
||||
<g transform="translate(115 200)">
|
||||
<rect width="1370" height="260" rx="24" class="soft" />
|
||||
<g class="math-expression">
|
||||
<text x="36" y="58" class="h2">1. Place </text>
|
||||
<g transform="translate(177.12 58)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">3</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">4</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="130" y1="155" x2="640" y2="155" class="axis" />
|
||||
<polygon points="640,155 610,138 610,172" fill="#26383d" />
|
||||
<g transform="translate(130 0)">
|
||||
<line x1="0" y1="125" x2="0" y2="185" class="tick" />
|
||||
<text x="0" y="220" text-anchor="middle" class="body">0</text>
|
||||
<line x1="120" y1="135" x2="120" y2="175" class="tick" />
|
||||
<line x1="240" y1="135" x2="240" y2="175" class="tick" />
|
||||
<line x1="360" y1="135" x2="360" y2="175" class="tick" />
|
||||
<line x1="480" y1="125" x2="480" y2="185" class="tick" />
|
||||
<text x="480" y="220" text-anchor="middle" class="body">1</text>
|
||||
</g>
|
||||
<text x="760" y="125" class="body">Unité partagée en 4 parts.</text>
|
||||
<text x="760" y="180" class="body">Avance de combien de parts ?</text>
|
||||
<line x1="1090" y1="180" x2="1260" y2="180" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(115 520)">
|
||||
<rect width="1370" height="230" rx="24" class="panel" />
|
||||
<text x="36" y="58" class="h2">2. Lis le point</text>
|
||||
<line x1="130" y1="145" x2="640" y2="145" class="axis" />
|
||||
<polygon points="640,145 610,128 610,162" fill="#26383d" />
|
||||
<g transform="translate(130 0)">
|
||||
<line x1="0" y1="115" x2="0" y2="175" class="tick" />
|
||||
<text x="0" y="210" text-anchor="middle" class="body">0</text>
|
||||
<line x1="96" y1="125" x2="96" y2="165" class="tick" />
|
||||
<line x1="192" y1="125" x2="192" y2="165" class="tick" />
|
||||
<circle cx="192" cy="145" r="16" class="orange" />
|
||||
<line x1="288" y1="125" x2="288" y2="165" class="tick" />
|
||||
<line x1="384" y1="125" x2="384" y2="165" class="tick" />
|
||||
<line x1="480" y1="115" x2="480" y2="175" class="tick" />
|
||||
<text x="480" y="210" text-anchor="middle" class="body">1</text>
|
||||
</g>
|
||||
<text x="760" y="125" class="body">L'unité est en 5 parts.</text>
|
||||
<text x="760" y="180" class="body">Le point indique :</text>
|
||||
<line x1="980" y1="180" x2="1260" y2="180" class="blank" />
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 3.1 KiB After Width: | Height: | Size: 3.4 KiB |
@@ -1,8 +1,124 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:38px;font-weight:800;fill:#074f4b}.line{stroke:#26383d;stroke-width:4}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.green{fill:#2f9246}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/><text x="800" y="116" text-anchor="middle" class="title">Exercices - Fraction supérieure à 1</text>
|
||||
<g transform="translate(105 190)"><rect width="455" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">1. Entoure > 1</text><g class="math-expression"><g transform="translate(65 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">2</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">5</text></g></g><g class="math-expression"><g transform="translate(250 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">5</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">5</text></g></g><g class="math-expression"><g transform="translate(65 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">7</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">5</text></g></g><g class="math-expression"><g transform="translate(250 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">9</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">4</text></g></g><g class="math-expression"><g transform="translate(65 365)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">3</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">8</text></g></g><text x="55" y="480" class="body">Attention : égal à 1 n'est pas > 1.</text></g>
|
||||
<g transform="translate(610 190)"><rect width="455" height="560" rx="24" class="panel"/><text x="32" y="58" class="h2">2. Complète</text><g class="math-expression"><g transform="translate(55 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">5</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">4</text></g><text x="107.44" y="145" class="num"> = </text><g transform="translate(184.72 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">4</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">4</text></g><text x="237.16" y="145" class="num"> +</text></g><line x1="320" y1="145" x2="410" y2="145" class="blank"/><g class="math-expression"><g transform="translate(55 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">7</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">3</text></g><text x="107.44" y="255" class="num"> = </text><g transform="translate(184.72 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">6</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">3</text></g><text x="237.16" y="255" class="num"> +</text></g><line x1="320" y1="255" x2="410" y2="255" class="blank"/><g class="math-expression"><g transform="translate(55 365)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">9</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">2</text></g><text x="107.44" y="365" class="num"> = </text><g transform="translate(184.72 365)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">8</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">2</text></g><text x="237.16" y="365" class="num"> +</text></g><line x1="320" y1="365" x2="410" y2="365" class="blank"/></g>
|
||||
<g transform="translate(1115 190)"><rect width="380" height="560" rx="24" class="soft"/><g class="math-expression"><text x="32" y="58" class="h2">3. Représente </text><g transform="translate(251.52 58)" class="fraction-g"><text x="14" y="-9.52" text-anchor="middle" class="h2">7</text><line x1="0" y1="1.12" x2="28" y2="1.12" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="16.24" text-anchor="middle" class="h2">4</text></g></g><g transform="translate(45 120)"><rect width="280" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><rect width="70" height="70" rx="10" class="green"/><rect x="70" width="70" height="70" class="green"/><rect x="140" width="70" height="70" class="green"/><rect x="210" width="70" height="70" class="green"/><line x1="70" y1="0" x2="70" y2="70" class="line"/><line x1="140" y1="0" x2="140" y2="70" class="line"/><line x1="210" y1="0" x2="210" y2="70" class="line"/><rect y="115" width="280" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><line x1="70" y1="115" x2="70" y2="185" class="line"/><line x1="140" y1="115" x2="140" y2="185" class="line"/><line x1="210" y1="115" x2="210" y2="185" class="line"/></g><text x="45" y="390" class="body">Colorie le reste.</text><line x1="45" y1="455" x2="320" y2="455" class="blank"/></g>
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:38px;font-weight:800;fill:#074f4b}.line{stroke:#26383d;stroke-width:4}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.green{fill:#2f9246}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Exercices - Fraction supérieure à 1</text>
|
||||
<g transform="translate(105 190)">
|
||||
<rect width="455" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">1. Entoure > 1</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(65 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(250 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">5</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(65 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">7</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(250 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">9</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(65 365)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">8</text>
|
||||
</g>
|
||||
</g>
|
||||
<text x="55" y="480" class="body">Attention : égal à 1 n'est pas > 1.</text>
|
||||
</g>
|
||||
<g transform="translate(610 190)">
|
||||
<rect width="455" height="560" rx="24" class="panel" />
|
||||
<text x="32" y="58" class="h2">2. Complète</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">5</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
<text x="107.44" y="171" class="num"> = </text>
|
||||
<g transform="translate(184.72 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">4</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
<text x="237.16" y="171" class="num"> +</text>
|
||||
</g>
|
||||
<line x1="320" y1="145" x2="410" y2="145" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">7</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">3</text>
|
||||
</g>
|
||||
<text x="107.44" y="281" class="num"> = </text>
|
||||
<g transform="translate(184.72 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">6</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">3</text>
|
||||
</g>
|
||||
<text x="237.16" y="281" class="num"> +</text>
|
||||
</g>
|
||||
<line x1="320" y1="255" x2="410" y2="255" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 365)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">9</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">2</text>
|
||||
</g>
|
||||
<text x="107.44" y="391" class="num"> = </text>
|
||||
<g transform="translate(184.72 365)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">8</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">2</text>
|
||||
</g>
|
||||
<text x="237.16" y="391" class="num"> +</text>
|
||||
</g>
|
||||
<line x1="320" y1="365" x2="410" y2="365" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(1115 190)">
|
||||
<rect width="380" height="560" rx="24" class="soft" />
|
||||
<g class="math-expression">
|
||||
<text x="32" y="58" class="h2">3. Représente </text>
|
||||
<g transform="translate(251.52 58)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">7</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">4</text>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(45 120)">
|
||||
<rect width="280" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="70" height="70" rx="10" class="green" />
|
||||
<rect x="70" width="70" height="70" class="green" />
|
||||
<rect x="140" width="70" height="70" class="green" />
|
||||
<rect x="210" width="70" height="70" class="green" />
|
||||
<line x1="70" y1="0" x2="70" y2="70" class="line" />
|
||||
<line x1="140" y1="0" x2="140" y2="70" class="line" />
|
||||
<line x1="210" y1="0" x2="210" y2="70" class="line" />
|
||||
<rect y="115" width="280" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<line x1="70" y1="115" x2="70" y2="185" class="line" />
|
||||
<line x1="140" y1="115" x2="140" y2="185" class="line" />
|
||||
<line x1="210" y1="115" x2="210" y2="185" class="line" />
|
||||
</g>
|
||||
<text x="45" y="390" class="body">Colorie le reste.</text>
|
||||
<line x1="45" y1="455" x2="320" y2="455" class="blank" />
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 6.3 KiB After Width: | Height: | Size: 7.0 KiB |
@@ -1,8 +1,135 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:42px;font-weight:800;fill:#074f4b}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.blue{fill:#1d78b5}.line{stroke:#26383d;stroke-width:4}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/><text x="800" y="116" text-anchor="middle" class="title">Exercices - Comparer des fractions</text>
|
||||
<g transform="translate(105 190)"><rect width="455" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">1. Complète</text><g class="math-expression"><g transform="translate(55 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">2</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">7</text></g></g><line x1="170" y1="145" x2="235" y2="145" class="blank"/><g class="math-expression"><g transform="translate(260 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">5</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">7</text></g></g><g class="math-expression"><g transform="translate(55 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">6</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">8</text></g></g><line x1="170" y1="255" x2="235" y2="255" class="blank"/><g class="math-expression"><g transform="translate(260 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">3</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">8</text></g></g><g class="math-expression"><g transform="translate(55 365)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">4</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">9</text></g></g><line x1="170" y1="365" x2="235" y2="365" class="blank"/><g class="math-expression"><g transform="translate(260 365)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">4</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">9</text></g></g></g>
|
||||
<g transform="translate(610 190)"><rect width="455" height="560" rx="24" class="panel"/><text x="32" y="58" class="h2">2. Choisis la plus grande</text><g class="math-expression"><g transform="translate(55 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">1</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">2</text></g><text x="107.44" y="145" class="num"> ou </text><g transform="translate(210.48 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">1</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">4</text></g></g><line x1="55" y1="190" x2="385" y2="190" class="blank"/><g class="math-expression"><g transform="translate(55 280)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">2</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">3</text></g><text x="107.44" y="280" class="num"> ou </text><g transform="translate(210.48 280)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">2</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">5</text></g></g><line x1="55" y1="325" x2="385" y2="325" class="blank"/><g class="math-expression"><g transform="translate(55 415)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">3</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">6</text></g><text x="107.44" y="415" class="num"> ou </text><g transform="translate(210.48 415)" class="fraction-g"><text x="25.3" y="-15.64" text-anchor="middle" class="num">3</text><line x1="0" y1="1.84" x2="50.6" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="25.3" y="26.68" text-anchor="middle" class="num">10</text></g></g><line x1="55" y1="460" x2="385" y2="460" class="blank"/></g>
|
||||
<g transform="translate(1115 190)"><rect width="380" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">3. Compare avec 1</text><g class="math-expression"><g transform="translate(55 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">5</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">6</text></g></g><line x1="165" y1="145" x2="230" y2="145" class="blank"/><text x="255" y="145" class="num">1</text><g class="math-expression"><g transform="translate(55 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">6</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">6</text></g></g><line x1="165" y1="255" x2="230" y2="255" class="blank"/><text x="255" y="255" class="num">1</text><g class="math-expression"><g transform="translate(55 365)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">8</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">6</text></g></g><line x1="165" y1="365" x2="230" y2="365" class="blank"/><text x="255" y="365" class="num">1</text><text x="55" y="475" class="body">Justifie un choix.</text></g>
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:42px;font-weight:800;fill:#074f4b}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.blue{fill:#1d78b5}.line{stroke:#26383d;stroke-width:4}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Exercices - Comparer des fractions</text>
|
||||
<g transform="translate(105 190)">
|
||||
<rect width="455" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">1. Complète</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">7</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="170" y1="145" x2="235" y2="145" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(260 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">5</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">7</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">6</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">8</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="170" y1="255" x2="235" y2="255" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(260 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">8</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 365)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">4</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">9</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="170" y1="365" x2="235" y2="365" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(260 365)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">4</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">9</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(610 190)">
|
||||
<rect width="455" height="560" rx="24" class="panel" />
|
||||
<text x="32" y="58" class="h2">2. Choisis la plus grande</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">1</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">2</text>
|
||||
</g>
|
||||
<text x="107.44" y="171" class="num"> ou </text>
|
||||
<g transform="translate(210.48 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">1</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="55" y1="190" x2="385" y2="190" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 280)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">3</text>
|
||||
</g>
|
||||
<text x="107.44" y="306" class="num"> ou </text>
|
||||
<g transform="translate(210.48 280)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="55" y1="325" x2="385" y2="325" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 415)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">6</text>
|
||||
</g>
|
||||
<text x="107.44" y="441" class="num"> ou </text>
|
||||
<g transform="translate(210.48 415)" class="fraction-g">
|
||||
<text x="38" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="76" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="38" y="54" text-anchor="middle" class="num">10</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="55" y1="460" x2="385" y2="460" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(1115 190)">
|
||||
<rect width="380" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">3. Compare avec 1</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">5</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">6</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="165" y1="145" x2="230" y2="145" class="blank" />
|
||||
<text x="255" y="145" class="num">1</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">6</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">6</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="165" y1="255" x2="230" y2="255" class="blank" />
|
||||
<text x="255" y="255" class="num">1</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 365)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">8</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">6</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="165" y1="365" x2="230" y2="365" class="blank" />
|
||||
<text x="255" y="365" class="num">1</text>
|
||||
<text x="55" y="475" class="body">Justifie un choix.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 7.4 KiB |
@@ -1,8 +1,78 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:40px;font-weight:800;fill:#074f4b}.axis{stroke:#26383d;stroke-width:5}.tick{stroke:#26383d;stroke-width:4}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/><text x="800" y="116" text-anchor="middle" class="title">Exercices - Ençadrer une fraction</text>
|
||||
<g transform="translate(105 190)"><rect width="455" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">1. Entiers en fractions</text><text x="45" y="145" class="num">1 =</text><line x1="130" y1="145" x2="215" y2="145" class="blank"/><text x="235" y="145" class="num">/4</text><text x="45" y="245" class="num">2 =</text><line x1="130" y1="245" x2="215" y2="245" class="blank"/><text x="235" y="245" class="num">/4</text><text x="45" y="365" class="body">Puis recommence en tiers.</text></g>
|
||||
<g transform="translate(610 190)"><rect width="455" height="560" rx="24" class="panel"/><text x="32" y="58" class="h2">2. Complète</text><line x1="55" y1="145" x2="115" y2="145" class="blank"/><g class="math-expression"><text x="130" y="145" class="num">< </text><g transform="translate(181.52 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">5</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">4</text></g><text x="233.96" y="145" class="num"> <</text></g><line x1="325" y1="145" x2="395" y2="145" class="blank"/><line x1="55" y1="255" x2="115" y2="255" class="blank"/><g class="math-expression"><text x="130" y="255" class="num">< </text><g transform="translate(181.52 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">8</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">3</text></g><text x="233.96" y="255" class="num"> <</text></g><line x1="325" y1="255" x2="395" y2="255" class="blank"/><line x1="55" y1="365" x2="115" y2="365" class="blank"/><g class="math-expression"><text x="130" y="365" class="num">< </text><g transform="translate(181.52 365)" class="fraction-g"><text x="25.3" y="-15.64" text-anchor="middle" class="num">11</text><line x1="0" y1="1.84" x2="50.6" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="25.3" y="26.68" text-anchor="middle" class="num">5</text></g><text x="251.44" y="365" class="num"> <</text></g><line x1="345" y1="365" x2="415" y2="365" class="blank"/></g>
|
||||
<g transform="translate(1115 190)"><rect width="380" height="560" rx="24" class="soft"/><g class="math-expression"><text x="32" y="58" class="h2">3. Place </text><g transform="translate(173.12 58)" class="fraction-g"><text x="15.4" y="-9.52" text-anchor="middle" class="h2">13</text><line x1="0" y1="1.12" x2="30.8" y2="1.12" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="15.4" y="16.24" text-anchor="middle" class="h2">6</text></g></g><line x1="45" y1="210" x2="320" y2="210" class="axis"/><g transform="translate(60 0)"><line x1="0" y1="180" x2="0" y2="240" class="tick"/><text x="0" y="275" text-anchor="middle" class="body">1</text><line x1="120" y1="180" x2="120" y2="240" class="tick"/><text x="120" y="275" text-anchor="middle" class="body">2</text><line x1="240" y1="180" x2="240" y2="240" class="tick"/><text x="240" y="275" text-anchor="middle" class="body">3</text></g><text x="45" y="370" class="body">Ençadrement :</text><line x1="45" y1="425" x2="320" y2="425" class="blank"/></g>
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:40px;font-weight:800;fill:#074f4b}.axis{stroke:#26383d;stroke-width:5}.tick{stroke:#26383d;stroke-width:4}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Exercices - Encadrer une fraction</text>
|
||||
<g transform="translate(105 190)">
|
||||
<rect width="455" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">1. Entiers en fractions</text>
|
||||
<text x="45" y="145" class="num">1 =</text>
|
||||
<line x1="130" y1="145" x2="215" y2="145" class="blank" />
|
||||
<text x="235" y="145" class="num">/4</text>
|
||||
<text x="45" y="245" class="num">2 =</text>
|
||||
<line x1="130" y1="245" x2="215" y2="245" class="blank" />
|
||||
<text x="235" y="245" class="num">/4</text>
|
||||
<text x="45" y="365" class="body">Puis recommence en tiers.</text>
|
||||
</g>
|
||||
<g transform="translate(610 190)">
|
||||
<rect width="455" height="560" rx="24" class="panel" />
|
||||
<text x="32" y="58" class="h2">2. Complète</text>
|
||||
<line x1="55" y1="145" x2="115" y2="145" class="blank" />
|
||||
<g class="math-expression">
|
||||
<text x="130" y="171" class="num">< </text>
|
||||
<g transform="translate(181.52 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">5</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
<text x="233.96" y="171" class="num"> <</text>
|
||||
</g>
|
||||
<line x1="325" y1="145" x2="395" y2="145" class="blank" />
|
||||
<line x1="55" y1="255" x2="115" y2="255" class="blank" />
|
||||
<g class="math-expression">
|
||||
<text x="130" y="281" class="num">< </text>
|
||||
<g transform="translate(181.52 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">8</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">3</text>
|
||||
</g>
|
||||
<text x="233.96" y="281" class="num"> <</text>
|
||||
</g>
|
||||
<line x1="325" y1="255" x2="395" y2="255" class="blank" />
|
||||
<line x1="55" y1="365" x2="115" y2="365" class="blank" />
|
||||
<g class="math-expression">
|
||||
<text x="130" y="391" class="num">< </text>
|
||||
<g transform="translate(181.52 365)" class="fraction-g">
|
||||
<text x="38" y="-28" text-anchor="middle" class="num">11</text>
|
||||
<line x1="0" y1="5" x2="76" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="38" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
<text x="251.44" y="391" class="num"> <</text>
|
||||
</g>
|
||||
<line x1="345" y1="365" x2="415" y2="365" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(1115 190)">
|
||||
<rect width="380" height="560" rx="24" class="soft" />
|
||||
<g class="math-expression">
|
||||
<text x="32" y="58" class="h2">3. Place </text>
|
||||
<g transform="translate(173.12 58)" class="fraction-g">
|
||||
<text x="30" y="-21" text-anchor="middle" class="h2">13</text>
|
||||
<line x1="0" y1="4" x2="60" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="30" y="39" text-anchor="middle" class="h2">6</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="45" y1="210" x2="320" y2="210" class="axis" />
|
||||
<g transform="translate(60 0)">
|
||||
<line x1="0" y1="180" x2="0" y2="240" class="tick" />
|
||||
<text x="0" y="275" text-anchor="middle" class="body">1</text>
|
||||
<line x1="120" y1="180" x2="120" y2="240" class="tick" />
|
||||
<text x="120" y="275" text-anchor="middle" class="body">2</text>
|
||||
<line x1="240" y1="180" x2="240" y2="240" class="tick" />
|
||||
<text x="240" y="275" text-anchor="middle" class="body">3</text>
|
||||
</g>
|
||||
<text x="45" y="370" class="body">Ençadrement :</text>
|
||||
<line x1="45" y1="425" x2="320" y2="425" class="blank" />
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 4.5 KiB |
@@ -1,8 +1,141 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:50px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:40px;font-weight:800;fill:#074f4b}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.blue{fill:#1d78b5}.line{stroke:#26383d;stroke-width:4}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/><text x="800" y="116" text-anchor="middle" class="title">Exercices - Additionner et soustraire des fractions</text>
|
||||
<g transform="translate(105 190)"><rect width="455" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">1. Additionne</text><g class="math-expression"><g transform="translate(55 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">1</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">5</text></g><text x="107.44" y="145" class="num"> + </text><g transform="translate(184.72 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">2</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">5</text></g><text x="237.16" y="145" class="num"> =</text></g><line x1="320" y1="145" x2="410" y2="145" class="blank"/><g class="math-expression"><g transform="translate(55 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">2</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">7</text></g><text x="107.44" y="255" class="num"> + </text><g transform="translate(184.72 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">3</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">7</text></g><text x="237.16" y="255" class="num"> =</text></g><line x1="320" y1="255" x2="410" y2="255" class="blank"/><g class="math-expression"><g transform="translate(55 365)" class="fraction-g"><text x="25.3" y="-15.64" text-anchor="middle" class="num">4</text><line x1="0" y1="1.84" x2="50.6" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="25.3" y="26.68" text-anchor="middle" class="num">10</text></g><text x="124.92" y="365" class="num"> + </text><g transform="translate(202.2 365)" class="fraction-g"><text x="25.3" y="-15.64" text-anchor="middle" class="num">5</text><line x1="0" y1="1.84" x2="50.6" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="25.3" y="26.68" text-anchor="middle" class="num">10</text></g><text x="272.12" y="365" class="num"> =</text></g><line x1="360" y1="365" x2="430" y2="365" class="blank"/></g>
|
||||
<g transform="translate(610 190)"><rect width="455" height="560" rx="24" class="panel"/><text x="32" y="58" class="h2">2. Soustrais</text><g class="math-expression"><g transform="translate(55 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">6</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">8</text></g><text x="107.44" y="145" class="num"> - </text><g transform="translate(184.72 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">2</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">8</text></g><text x="237.16" y="145" class="num"> =</text></g><line x1="320" y1="145" x2="410" y2="145" class="blank"/><g class="math-expression"><g transform="translate(55 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">7</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">9</text></g><text x="107.44" y="255" class="num"> - </text><g transform="translate(184.72 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">3</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">9</text></g><text x="237.16" y="255" class="num"> =</text></g><line x1="320" y1="255" x2="410" y2="255" class="blank"/><g class="math-expression"><g transform="translate(55 365)" class="fraction-g"><text x="25.3" y="-15.64" text-anchor="middle" class="num">10</text><line x1="0" y1="1.84" x2="50.6" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="25.3" y="26.68" text-anchor="middle" class="num">12</text></g><text x="142.4" y="365" class="num"> - </text><g transform="translate(219.68 365)" class="fraction-g"><text x="25.3" y="-15.64" text-anchor="middle" class="num">4</text><line x1="0" y1="1.84" x2="50.6" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="25.3" y="26.68" text-anchor="middle" class="num">12</text></g><text x="289.6" y="365" class="num"> =</text></g><line x1="370" y1="365" x2="430" y2="365" class="blank"/></g>
|
||||
<g transform="translate(1115 190)"><rect width="380" height="560" rx="24" class="soft"/><g class="math-expression"><text x="32" y="58" class="h2">3. Dessine </text><g transform="translate(204.48 58)" class="fraction-g"><text x="14" y="-9.52" text-anchor="middle" class="h2">2</text><line x1="0" y1="1.12" x2="28" y2="1.12" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="16.24" text-anchor="middle" class="h2">7</text></g><text x="238.48" y="58" class="h2"> + </text><g transform="translate(285.52 58)" class="fraction-g"><text x="14" y="-9.52" text-anchor="middle" class="h2">3</text><line x1="0" y1="1.12" x2="28" y2="1.12" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="16.24" text-anchor="middle" class="h2">7</text></g></g><g transform="translate(45 135)"><rect width="280" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><rect width="40" height="70" rx="10" class="orange"/><rect x="40" width="40" height="70" class="orange"/><rect x="80" width="40" height="70" class="blue"/><rect x="120" width="40" height="70" class="blue"/><rect x="160" width="40" height="70" class="blue"/><line x1="40" y1="0" x2="40" y2="70" class="line"/><line x1="80" y1="0" x2="80" y2="70" class="line"/><line x1="120" y1="0" x2="120" y2="70" class="line"/><line x1="160" y1="0" x2="160" y2="70" class="line"/><line x1="200" y1="0" x2="200" y2="70" class="line"/><line x1="240" y1="0" x2="240" y2="70" class="line"/></g><text x="45" y="300" class="body">Résultat :</text><line x1="45" y1="350" x2="320" y2="350" class="blank"/><text x="45" y="450" class="body">Le dénominateur reste :</text><line x1="45" y1="500" x2="320" y2="500" class="blank"/></g>
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:50px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:40px;font-weight:800;fill:#074f4b}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.blue{fill:#1d78b5}.line{stroke:#26383d;stroke-width:4}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Exercices - Additionner et soustraire des fractions</text>
|
||||
<g transform="translate(105 190)">
|
||||
<rect width="455" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">1. Additionne</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">1</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
<text x="107.44" y="171" class="num"> + </text>
|
||||
<g transform="translate(184.72 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
<text x="237.16" y="171" class="num"> =</text>
|
||||
</g>
|
||||
<line x1="320" y1="145" x2="410" y2="145" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">7</text>
|
||||
</g>
|
||||
<text x="107.44" y="281" class="num"> + </text>
|
||||
<g transform="translate(184.72 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">7</text>
|
||||
</g>
|
||||
<text x="237.16" y="281" class="num"> =</text>
|
||||
</g>
|
||||
<line x1="320" y1="255" x2="410" y2="255" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 365)" class="fraction-g">
|
||||
<text x="38" y="-28" text-anchor="middle" class="num">4</text>
|
||||
<line x1="0" y1="5" x2="76" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="38" y="54" text-anchor="middle" class="num">10</text>
|
||||
</g>
|
||||
<text x="124.92" y="391" class="num"> + </text>
|
||||
<g transform="translate(202.2 365)" class="fraction-g">
|
||||
<text x="38" y="-28" text-anchor="middle" class="num">5</text>
|
||||
<line x1="0" y1="5" x2="76" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="38" y="54" text-anchor="middle" class="num">10</text>
|
||||
</g>
|
||||
<text x="272.12" y="391" class="num"> =</text>
|
||||
</g>
|
||||
<line x1="360" y1="365" x2="430" y2="365" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(610 190)">
|
||||
<rect width="455" height="560" rx="24" class="panel" />
|
||||
<text x="32" y="58" class="h2">2. Soustrais</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">6</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">8</text>
|
||||
</g>
|
||||
<text x="107.44" y="171" class="num"> - </text>
|
||||
<g transform="translate(184.72 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">8</text>
|
||||
</g>
|
||||
<text x="237.16" y="171" class="num"> =</text>
|
||||
</g>
|
||||
<line x1="320" y1="145" x2="410" y2="145" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">7</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">9</text>
|
||||
</g>
|
||||
<text x="107.44" y="281" class="num"> - </text>
|
||||
<g transform="translate(184.72 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">9</text>
|
||||
</g>
|
||||
<text x="237.16" y="281" class="num"> =</text>
|
||||
</g>
|
||||
<line x1="320" y1="255" x2="410" y2="255" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 365)" class="fraction-g">
|
||||
<text x="38" y="-28" text-anchor="middle" class="num">10</text>
|
||||
<line x1="0" y1="5" x2="76" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="38" y="54" text-anchor="middle" class="num">12</text>
|
||||
</g>
|
||||
<text x="142.4" y="391" class="num"> - </text>
|
||||
<g transform="translate(219.68 365)" class="fraction-g">
|
||||
<text x="38" y="-28" text-anchor="middle" class="num">4</text>
|
||||
<line x1="0" y1="5" x2="76" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="38" y="54" text-anchor="middle" class="num">12</text>
|
||||
</g>
|
||||
<text x="289.6" y="391" class="num"> =</text>
|
||||
</g>
|
||||
<line x1="370" y1="365" x2="430" y2="365" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(1115 190)">
|
||||
<rect width="380" height="560" rx="24" class="soft" />
|
||||
<g class="math-expression">
|
||||
<text x="32" y="58" class="h2">3. Dessine </text>
|
||||
<g transform="translate(204.48 58)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">2</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">7</text>
|
||||
</g>
|
||||
<text x="238.48" y="75" class="h2"> + </text>
|
||||
<g transform="translate(285.52 58)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">3</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">7</text>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(45 135)">
|
||||
<rect width="280" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="40" height="70" rx="10" class="orange" />
|
||||
<rect x="40" width="40" height="70" class="orange" />
|
||||
<rect x="80" width="40" height="70" class="blue" />
|
||||
<rect x="120" width="40" height="70" class="blue" />
|
||||
<rect x="160" width="40" height="70" class="blue" />
|
||||
<line x1="40" y1="0" x2="40" y2="70" class="line" />
|
||||
<line x1="80" y1="0" x2="80" y2="70" class="line" />
|
||||
<line x1="120" y1="0" x2="120" y2="70" class="line" />
|
||||
<line x1="160" y1="0" x2="160" y2="70" class="line" />
|
||||
<line x1="200" y1="0" x2="200" y2="70" class="line" />
|
||||
<line x1="240" y1="0" x2="240" y2="70" class="line" />
|
||||
</g>
|
||||
<text x="45" y="300" class="body">Résultat :</text>
|
||||
<line x1="45" y1="350" x2="320" y2="350" class="blank" />
|
||||
<text x="45" y="450" class="body">Le dénominateur reste :</text>
|
||||
<line x1="45" y1="500" x2="320" y2="500" class="blank" />
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 7.3 KiB After Width: | Height: | Size: 8.1 KiB |
@@ -1,8 +1,79 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:38px;font-weight:800;fill:#074f4b}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.line{stroke:#26383d;stroke-width:4}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/><text x="800" y="116" text-anchor="middle" class="title">Exercices - Fraction d'une quantité</text>
|
||||
<g transform="translate(105 190)"><rect width="455" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">1. Une part</text><g class="math-expression"><g transform="translate(55 145)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">1</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">2</text></g><text x="107.44" y="145" class="num"> de 18 =</text></g><line x1="300" y1="145" x2="410" y2="145" class="blank"/><g class="math-expression"><g transform="translate(55 255)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">1</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">3</text></g><text x="107.44" y="255" class="num"> de 24 =</text></g><line x1="300" y1="255" x2="410" y2="255" class="blank"/><g class="math-expression"><g transform="translate(55 365)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">1</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">5</text></g><text x="107.44" y="365" class="num"> de 40 =</text></g><line x1="300" y1="365" x2="410" y2="365" class="blank"/></g>
|
||||
<g transform="translate(610 190)"><rect width="455" height="560" rx="24" class="panel"/><text x="32" y="58" class="h2">2. Partage puis prends</text><g class="math-expression"><g transform="translate(55 130)" class="fraction-g"><text x="14" y="-15.64" text-anchor="middle" class="num">3</text><line x1="0" y1="1.84" x2="28" y2="1.84" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="26.68" text-anchor="middle" class="num">4</text></g><text x="107.44" y="130" class="num"> de 20</text></g><text x="55" y="205" class="body">20 ÷ 4 =</text><line x1="190" y1="205" x2="350" y2="205" class="blank"/><text x="55" y="285" class="body">Puis x 3 =</text><line x1="205" y1="285" x2="350" y2="285" class="blank"/><g transform="translate(55 375)"><rect width="330" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><line x1="82.5" y1="0" x2="82.5" y2="70" class="line"/><line x1="165" y1="0" x2="165" y2="70" class="line"/><line x1="247.5" y1="0" x2="247.5" y2="70" class="line"/></g></g>
|
||||
<g transform="translate(1115 190)"><rect width="380" height="560" rx="24" class="soft"/><text x="32" y="58" class="h2">3. Problème</text><text x="45" y="120" class="body">28 élèves.</text><g class="math-expression"><g transform="translate(45 165)" class="fraction-g"><text x="14" y="-8.16" text-anchor="middle" class="body">3</text><line x1="0" y1="0.96" x2="28" y2="0.96" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="14" y="13.92" text-anchor="middle" class="body">4</text></g><text x="79" y="165" class="body"> participent.</text></g><text x="45" y="240" class="body">Combien ?</text><line x1="45" y1="300" x2="320" y2="300" class="blank"/><text x="45" y="405" class="body">Deux gestes :</text><text x="45" y="455" class="body">1. partager</text><text x="45" y="505" class="body">2. prendre</text></g>
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#d9e7e1;stroke-width:3}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:3}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:52px;font-weight:800;fill:#074f4b}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:25px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:38px;font-weight:800;fill:#074f4b}.blank{stroke:#7fa79d;stroke-width:3;stroke-dasharray:10 10}.orange{fill:#e78232}.line{stroke:#26383d;stroke-width:4}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Exercices - Fraction d'une quantité</text>
|
||||
<g transform="translate(105 190)">
|
||||
<rect width="455" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">1. Une part</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 145)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">1</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">2</text>
|
||||
</g>
|
||||
<text x="107.44" y="171" class="num"> de 18 =</text>
|
||||
</g>
|
||||
<line x1="300" y1="145" x2="410" y2="145" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 255)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">1</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">3</text>
|
||||
</g>
|
||||
<text x="107.44" y="281" class="num"> de 24 =</text>
|
||||
</g>
|
||||
<line x1="300" y1="255" x2="410" y2="255" class="blank" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 365)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">1</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
<text x="107.44" y="391" class="num"> de 40 =</text>
|
||||
</g>
|
||||
<line x1="300" y1="365" x2="410" y2="365" class="blank" />
|
||||
</g>
|
||||
<g transform="translate(610 190)">
|
||||
<rect width="455" height="560" rx="24" class="panel" />
|
||||
<text x="32" y="58" class="h2">2. Partage puis prends</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(55 130)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
<text x="107.44" y="156" class="num"> de 20</text>
|
||||
</g>
|
||||
<text x="55" y="205" class="body">20 ÷ 4 =</text>
|
||||
<line x1="190" y1="205" x2="350" y2="205" class="blank" />
|
||||
<text x="55" y="285" class="body">Puis x 3 =</text>
|
||||
<line x1="205" y1="285" x2="350" y2="285" class="blank" />
|
||||
<g transform="translate(55 375)">
|
||||
<rect width="330" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<line x1="82.5" y1="0" x2="82.5" y2="70" class="line" />
|
||||
<line x1="165" y1="0" x2="165" y2="70" class="line" />
|
||||
<line x1="247.5" y1="0" x2="247.5" y2="70" class="line" />
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(1115 190)">
|
||||
<rect width="380" height="560" rx="24" class="soft" />
|
||||
<text x="32" y="58" class="h2">3. Problème</text>
|
||||
<text x="45" y="120" class="body">28 élèves.</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(45 165)" class="fraction-g">
|
||||
<text x="19" y="-18" text-anchor="middle" class="body">3</text>
|
||||
<line x1="0" y1="3" x2="38" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="19" y="34" text-anchor="middle" class="body">4</text>
|
||||
</g>
|
||||
<text x="79" y="178" class="body"> participent.</text>
|
||||
</g>
|
||||
<text x="45" y="240" class="body">Combien ?</text>
|
||||
<line x1="45" y1="300" x2="320" y2="300" class="blank" />
|
||||
<text x="45" y="405" class="body">Deux gestes :</text>
|
||||
<text x="45" y="455" class="body">1. partager</text>
|
||||
<text x="45" y="505" class="body">2. prendre</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 4.5 KiB |
@@ -1,35 +1,32 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="760" viewBox="0 0 1200 760">
|
||||
<rect width="1200" height="760" fill="#f7fafc"/>
|
||||
<rect x="60" y="50" width="1080" height="660" rx="28" fill="#ffffff" stroke="#d7e3df" stroke-width="6"/>
|
||||
<rect width="1200" height="760" fill="#f7fafc" />
|
||||
<rect x="60" y="50" width="1080" height="660" rx="28" fill="#ffffff" stroke="#d7e3df" stroke-width="6" />
|
||||
<text x="100" y="120" font-family="Inter, Arial, sans-serif" font-size="44" font-weight="700" fill="#0f3d5e">Aide fractions</text>
|
||||
<text x="100" y="170" font-family="Inter, Arial, sans-serif" font-size="24" fill="#415466">Une unité, des parts égales, des parts prises.</text>
|
||||
|
||||
<rect x="120" y="230" width="420" height="160" rx="20" fill="#eef6ff" stroke="#bfd7f2"/>
|
||||
<rect x="120" y="230" width="420" height="160" rx="20" fill="#eef6ff" stroke="#bfd7f2" />
|
||||
<text x="173" y="272" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="30" font-weight="700" fill="#0f3d5e">3</text>
|
||||
<text x="173" y="332" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="30" font-weight="700" fill="#0f3d5e">4</text>
|
||||
<text x="230" y="270" font-family="Inter, Arial, sans-serif" font-size="24" fill="#415466">3 parts prises</text>
|
||||
<text x="230" y="325" font-family="Inter, Arial, sans-serif" font-size="24" fill="#415466">4 parts égales</text>
|
||||
<line x1="150" y1="296" x2="196" y2="296" stroke="#1f2937" stroke-width="4"/>
|
||||
|
||||
<rect x="660" y="230" width="360" height="160" rx="20" fill="#fff7ed" stroke="#fed7aa"/>
|
||||
<rect x="720" y="292" width="240" height="58" fill="#ffffff" stroke="#1f2937" stroke-width="3"/>
|
||||
<line x1="780" y1="292" x2="780" y2="350" stroke="#1f2937" stroke-width="2"/>
|
||||
<line x1="840" y1="292" x2="840" y2="350" stroke="#1f2937" stroke-width="2"/>
|
||||
<line x1="900" y1="292" x2="900" y2="350" stroke="#1f2937" stroke-width="2"/>
|
||||
<rect x="720" y="292" width="180" height="58" fill="#f97316" opacity="0.45"/>
|
||||
<line x1="150" y1="296" x2="196" y2="296" stroke="#1f2937" stroke-width="4" />
|
||||
<rect x="660" y="230" width="360" height="160" rx="20" fill="#fff7ed" stroke="#fed7aa" />
|
||||
<rect x="720" y="292" width="240" height="58" fill="#ffffff" stroke="#1f2937" stroke-width="3" />
|
||||
<line x1="780" y1="292" x2="780" y2="350" stroke="#1f2937" stroke-width="2" />
|
||||
<line x1="840" y1="292" x2="840" y2="350" stroke="#1f2937" stroke-width="2" />
|
||||
<line x1="900" y1="292" x2="900" y2="350" stroke="#1f2937" stroke-width="2" />
|
||||
<rect x="720" y="292" width="180" height="58" fill="#f97316" opacity="0.45" />
|
||||
<text x="716" y="380" font-family="Inter, Arial, sans-serif" font-size="22" fill="#415466">3 parts sur 4</text>
|
||||
|
||||
<rect x="120" y="460" width="900" height="120" rx="20" fill="#f0fdf4" stroke="#bbf7d0"/>
|
||||
<line x1="200" y1="530" x2="900" y2="530" stroke="#1f2937" stroke-width="4"/>
|
||||
<line x1="200" y1="515" x2="200" y2="545" stroke="#1f2937" stroke-width="3"/>
|
||||
<line x1="900" y1="515" x2="900" y2="545" stroke="#1f2937" stroke-width="3"/>
|
||||
<line x1="375" y1="520" x2="375" y2="540" stroke="#64748b" stroke-width="2"/>
|
||||
<line x1="550" y1="520" x2="550" y2="540" stroke="#64748b" stroke-width="2"/>
|
||||
<line x1="725" y1="520" x2="725" y2="540" stroke="#64748b" stroke-width="2"/>
|
||||
<circle cx="725" cy="530" r="10" fill="#16a34a"/>
|
||||
<rect x="120" y="460" width="900" height="120" rx="20" fill="#f0fdf4" stroke="#bbf7d0" />
|
||||
<line x1="200" y1="530" x2="900" y2="530" stroke="#1f2937" stroke-width="4" />
|
||||
<line x1="200" y1="515" x2="200" y2="545" stroke="#1f2937" stroke-width="3" />
|
||||
<line x1="900" y1="515" x2="900" y2="545" stroke="#1f2937" stroke-width="3" />
|
||||
<line x1="375" y1="520" x2="375" y2="540" stroke="#64748b" stroke-width="2" />
|
||||
<line x1="550" y1="520" x2="550" y2="540" stroke="#64748b" stroke-width="2" />
|
||||
<line x1="725" y1="520" x2="725" y2="540" stroke="#64748b" stroke-width="2" />
|
||||
<circle cx="725" cy="530" r="10" fill="#16a34a" />
|
||||
<text x="190" y="570" font-family="Inter, Arial, sans-serif" font-size="20" fill="#1f2937">0</text>
|
||||
<text x="893" y="570" font-family="Inter, Arial, sans-serif" font-size="20" fill="#1f2937">1</text>
|
||||
<text x="725" y="458" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="24" font-weight="700" fill="#166534">3</text>
|
||||
<line x1="708" y1="468" x2="742" y2="468" stroke="#166534" stroke-width="3"/>
|
||||
<line x1="708" y1="468" x2="742" y2="468" stroke="#166534" stroke-width="3" />
|
||||
<text x="725" y="494" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="24" font-weight="700" fill="#166534">4</text>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 3.0 KiB |
@@ -1,43 +1,38 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="760" viewBox="0 0 1200 760">
|
||||
<rect width="1200" height="760" fill="#f7fafc"/>
|
||||
<rect x="60" y="50" width="1080" height="660" rx="28" fill="#ffffff" stroke="#d7e3df" stroke-width="6"/>
|
||||
<rect width="1200" height="760" fill="#f7fafc" />
|
||||
<rect x="60" y="50" width="1080" height="660" rx="28" fill="#ffffff" stroke="#d7e3df" stroke-width="6" />
|
||||
<text x="100" y="120" font-family="Inter, Arial, sans-serif" font-size="44" font-weight="700" fill="#0f3d5e">Diagnostic fractions</text>
|
||||
<text x="100" y="170" font-family="Inter, Arial, sans-serif" font-size="24" fill="#415466">Lis, dessine, place, puis compare.</text>
|
||||
|
||||
<rect x="100" y="220" width="230" height="160" rx="18" fill="#eef6ff" stroke="#bfd7f2"/>
|
||||
<rect x="100" y="220" width="230" height="160" rx="18" fill="#eef6ff" stroke="#bfd7f2" />
|
||||
<text x="130" y="270" font-family="Inter, Arial, sans-serif" font-size="28" font-weight="700" fill="#0f3d5e">1. Lire</text>
|
||||
<text x="215" y="320" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="44" font-weight="700" fill="#1f2937">3</text>
|
||||
<line x1="184" y1="335" x2="246" y2="335" stroke="#1f2937" stroke-width="5"/>
|
||||
<line x1="184" y1="335" x2="246" y2="335" stroke="#1f2937" stroke-width="5" />
|
||||
<text x="215" y="375" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="44" font-weight="700" fill="#1f2937">4</text>
|
||||
|
||||
<rect x="365" y="220" width="230" height="160" rx="18" fill="#fff7ed" stroke="#fed7aa"/>
|
||||
<rect x="365" y="220" width="230" height="160" rx="18" fill="#fff7ed" stroke="#fed7aa" />
|
||||
<text x="395" y="270" font-family="Inter, Arial, sans-serif" font-size="28" font-weight="700" fill="#9a3412">2. Partager</text>
|
||||
<rect x="410" y="310" width="140" height="44" fill="#ffffff" stroke="#1f2937" stroke-width="3"/>
|
||||
<line x1="445" y1="310" x2="445" y2="354" stroke="#1f2937" stroke-width="2"/>
|
||||
<line x1="480" y1="310" x2="480" y2="354" stroke="#1f2937" stroke-width="2"/>
|
||||
<line x1="515" y1="310" x2="515" y2="354" stroke="#1f2937" stroke-width="2"/>
|
||||
<rect x="410" y="310" width="105" height="44" fill="#f97316" opacity="0.45"/>
|
||||
|
||||
<rect x="630" y="220" width="230" height="160" rx="18" fill="#f0fdf4" stroke="#bbf7d0"/>
|
||||
<rect x="410" y="310" width="140" height="44" fill="#ffffff" stroke="#1f2937" stroke-width="3" />
|
||||
<line x1="445" y1="310" x2="445" y2="354" stroke="#1f2937" stroke-width="2" />
|
||||
<line x1="480" y1="310" x2="480" y2="354" stroke="#1f2937" stroke-width="2" />
|
||||
<line x1="515" y1="310" x2="515" y2="354" stroke="#1f2937" stroke-width="2" />
|
||||
<rect x="410" y="310" width="105" height="44" fill="#f97316" opacity="0.45" />
|
||||
<rect x="630" y="220" width="230" height="160" rx="18" fill="#f0fdf4" stroke="#bbf7d0" />
|
||||
<text x="660" y="270" font-family="Inter, Arial, sans-serif" font-size="28" font-weight="700" fill="#166534">3. Placer</text>
|
||||
<line x1="680" y1="335" x2="815" y2="335" stroke="#1f2937" stroke-width="4"/>
|
||||
<line x1="680" y1="325" x2="680" y2="345" stroke="#1f2937" stroke-width="3"/>
|
||||
<line x1="815" y1="325" x2="815" y2="345" stroke="#1f2937" stroke-width="3"/>
|
||||
<circle cx="781" cy="335" r="9" fill="#16a34a"/>
|
||||
<line x1="680" y1="335" x2="815" y2="335" stroke="#1f2937" stroke-width="4" />
|
||||
<line x1="680" y1="325" x2="680" y2="345" stroke="#1f2937" stroke-width="3" />
|
||||
<line x1="815" y1="325" x2="815" y2="345" stroke="#1f2937" stroke-width="3" />
|
||||
<circle cx="781" cy="335" r="9" fill="#16a34a" />
|
||||
<text x="670" y="370" font-family="Inter, Arial, sans-serif" font-size="18" fill="#1f2937">0</text>
|
||||
<text x="808" y="370" font-family="Inter, Arial, sans-serif" font-size="18" fill="#1f2937">1</text>
|
||||
|
||||
<rect x="895" y="220" width="205" height="160" rx="18" fill="#fef2f2" stroke="#fecaca"/>
|
||||
<rect x="895" y="220" width="205" height="160" rx="18" fill="#fef2f2" stroke="#fecaca" />
|
||||
<text x="925" y="270" font-family="Inter, Arial, sans-serif" font-size="28" font-weight="700" fill="#991b1b">4. Comparer</text>
|
||||
<text x="955" y="318" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="30" font-weight="700" fill="#1f2937">2</text>
|
||||
<line x1="936" y1="330" x2="974" y2="330" stroke="#1f2937" stroke-width="4"/>
|
||||
<line x1="936" y1="330" x2="974" y2="330" stroke="#1f2937" stroke-width="4" />
|
||||
<text x="955" y="362" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="30" font-weight="700" fill="#1f2937">5</text>
|
||||
<text x="998" y="344" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="34" font-weight="700" fill="#1f2937">?</text>
|
||||
<text x="1040" y="318" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="30" font-weight="700" fill="#1f2937">4</text>
|
||||
<line x1="1021" y1="330" x2="1059" y2="330" stroke="#1f2937" stroke-width="4"/>
|
||||
<line x1="1021" y1="330" x2="1059" y2="330" stroke="#1f2937" stroke-width="4" />
|
||||
<text x="1040" y="362" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="30" font-weight="700" fill="#1f2937">5</text>
|
||||
|
||||
<rect x="120" y="460" width="960" height="140" rx="20" fill="#f8fafc" stroke="#dbe3ef"/>
|
||||
<rect x="120" y="460" width="960" height="140" rx="20" fill="#f8fafc" stroke="#dbe3ef" />
|
||||
<text x="160" y="520" font-family="Inter, Arial, sans-serif" font-size="28" font-weight="700" fill="#0f3d5e">Observer surtout les erreurs, les hésitations et les mots utilisés.</text>
|
||||
<text x="160" y="565" font-family="Inter, Arial, sans-serif" font-size="24" fill="#415466">Le diagnostic choisit une aide. Il ne note pas l'élève.</text>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
@@ -1,43 +1,54 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs>
|
||||
<style>
|
||||
.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.frac{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:96px;font-weight:800;fill:#074f4b}.orange{fill:#e78232}.blue{fill:#1d78b5}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}
|
||||
.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900"/>
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Lire et écrire une fraction</text>
|
||||
<text x="800" y="160" text-anchor="middle" class="subtitle">Maths CM1 - Numérateur, dénominateur, unité</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4"/>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4" />
|
||||
<g transform="translate(110 245)">
|
||||
<rect width="455" height="300" rx="24" class="soft"/>
|
||||
<rect width="455" height="300" rx="24" class="soft" />
|
||||
<text x="34" y="58" class="h2">La fraction</text>
|
||||
<text x="228" y="150" text-anchor="middle" class="frac">3</text>
|
||||
<line x1="182" y1="178" x2="274" y2="178" class="line"/>
|
||||
<line x1="182" y1="178" x2="274" y2="178" class="line" />
|
||||
<text x="228" y="270" text-anchor="middle" class="frac">4</text>
|
||||
</g>
|
||||
<g transform="translate(625 245)">
|
||||
<rect width="360" height="300" rx="24" class="panel"/>
|
||||
<rect width="360" height="300" rx="24" class="panel" />
|
||||
<text x="30" y="58" class="h2">Ce que ça dit</text>
|
||||
<circle cx="55" cy="112" r="15" class="orange"/><text x="84" y="120" class="body">3 parts prises</text>
|
||||
<circle cx="55" cy="168" r="15" class="blue"/><text x="84" y="176" class="body">4 parts égales</text>
|
||||
<g class="math-expression"><g transform="translate(30 235)" class="fraction-g"><text x="16" y="-18" text-anchor="middle" class="body">3</text><line x1="0" y1="3" x2="32" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="16" y="34" text-anchor="middle" class="body">4</text></g><text x="64" y="235" class="body"> se lit :</text></g>
|
||||
<circle cx="55" cy="112" r="15" class="orange" />
|
||||
<text x="84" y="120" class="body">3 parts prises</text>
|
||||
<circle cx="55" cy="168" r="15" class="blue" />
|
||||
<text x="84" y="176" class="body">4 parts égales</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(30 235)" class="fraction-g">
|
||||
<text x="19" y="-18" text-anchor="middle" class="body">3</text>
|
||||
<line x1="0" y1="3" x2="38" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="19" y="34" text-anchor="middle" class="body">4</text>
|
||||
</g>
|
||||
<text x="64" y="248" class="body"> se lit :</text>
|
||||
</g>
|
||||
<text x="30" y="272" class="body">trois quarts</text>
|
||||
</g>
|
||||
<g transform="translate(1040 245)">
|
||||
<rect width="430" height="300" rx="24" class="panel"/>
|
||||
<rect width="430" height="300" rx="24" class="panel" />
|
||||
<text x="30" y="58" class="h2">L'unité partagée</text>
|
||||
<g transform="translate(45 110)">
|
||||
<rect x="0" y="0" width="320" height="90" rx="14" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/>
|
||||
<rect x="0" y="0" width="80" height="90" rx="14" class="orange"/>
|
||||
<rect x="80" y="0" width="80" height="90" class="orange"/>
|
||||
<rect x="160" y="0" width="80" height="90" class="orange"/>
|
||||
<line x1="80" y1="0" x2="80" y2="90" class="line"/><line x1="160" y1="0" x2="160" y2="90" class="line"/><line x1="240" y1="0" x2="240" y2="90" class="line"/>
|
||||
<rect x="0" y="0" width="320" height="90" rx="14" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect x="0" y="0" width="80" height="90" rx="14" class="orange" />
|
||||
<rect x="80" y="0" width="80" height="90" class="orange" />
|
||||
<rect x="160" y="0" width="80" height="90" class="orange" />
|
||||
<line x1="80" y1="0" x2="80" y2="90" class="line" />
|
||||
<line x1="160" y1="0" x2="160" y2="90" class="line" />
|
||||
<line x1="240" y1="0" x2="240" y2="90" class="line" />
|
||||
</g>
|
||||
<text x="45" y="248" class="small">L'unité est coupée en 4 parts égales.</text>
|
||||
</g>
|
||||
<g transform="translate(170 615)">
|
||||
<rect width="1260" height="150" rx="24" class="panel"/>
|
||||
<rect width="1260" height="150" rx="24" class="panel" />
|
||||
<text x="36" y="55" class="h2">À retenir</text>
|
||||
<text x="36" y="100" class="body">Le dénominateur indique le partage. Le numérateur indique les parts prises.</text>
|
||||
</g>
|
||||
|
||||
|
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 3.7 KiB |
@@ -1,17 +1,77 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.orange{fill:#e78232}.blue{fill:#1d78b5}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.orange{fill:#e78232}.blue{fill:#1d78b5}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Représenter une fraction</text>
|
||||
<text x="800" y="160" text-anchor="middle" class="subtitle">Je partage l'unité en parts égales, puis je colorie</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4"/>
|
||||
<g transform="translate(110 245)"><rect width="420" height="330" rx="24" class="panel"/><g class="math-expression"><text x="34" y="58" class="h2">Bande : </text><g transform="translate(159.44 58)" class="fraction-g"><text x="17" y="-24" text-anchor="middle" class="h2">3</text><line x1="0" y1="4" x2="34" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="17" y="42" text-anchor="middle" class="h2">5</text></g></g>
|
||||
<g transform="translate(45 132)"><rect width="320" height="92" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><rect width="64" height="92" rx="12" class="orange"/><rect x="64" width="64" height="92" class="orange"/><rect x="128" width="64" height="92" class="orange"/><line x1="64" y1="0" x2="64" y2="92" class="line"/><line x1="128" y1="0" x2="128" y2="92" class="line"/><line x1="192" y1="0" x2="192" y2="92" class="line"/><line x1="256" y1="0" x2="256" y2="92" class="line"/></g>
|
||||
<text x="45" y="285" class="small">5 parts égales, 3 parts coloriées</text></g>
|
||||
<g transform="translate(590 245)"><rect width="420" height="330" rx="24" class="soft"/><g class="math-expression"><text x="34" y="58" class="h2">Disque : </text><g transform="translate(175.12 58)" class="fraction-g"><text x="17" y="-24" text-anchor="middle" class="h2">1</text><line x1="0" y1="4" x2="34" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="17" y="42" text-anchor="middle" class="h2">4</text></g></g>
|
||||
<circle cx="210" cy="178" r="90" fill="#f7fbf9" stroke="#26383d" stroke-width="4"/><path d="M210 178 L210 88 A90 90 0 0 1 300 178 Z" class="blue"/><line x1="210" y1="88" x2="210" y2="268" class="line"/><line x1="120" y1="178" x2="300" y2="178" class="line"/>
|
||||
<text x="70" y="285" class="small">4 parts égales, 1 part coloriée</text></g>
|
||||
<g transform="translate(1070 245)"><rect width="420" height="330" rx="24" class="panel"/><g class="math-expression"><text x="34" y="58" class="h2">Collection : </text><g transform="translate(237.84 58)" class="fraction-g"><text x="20" y="-24" text-anchor="middle" class="h2">6</text><line x1="0" y1="4" x2="40" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="20" y="42" text-anchor="middle" class="h2">10</text></g></g>
|
||||
<g transform="translate(70 112)"><circle cx="0" cy="0" r="20" class="green"/><circle cx="55" cy="0" r="20" class="green"/><circle cx="110" cy="0" r="20" class="green"/><circle cx="165" cy="0" r="20" class="green"/><circle cx="220" cy="0" r="20" class="green"/><circle cx="275" cy="0" r="20" class="green"/><circle cx="0" cy="70" r="20" fill="#e8f3ee" stroke="#26383d"/><circle cx="55" cy="70" r="20" fill="#e8f3ee" stroke="#26383d"/><circle cx="110" cy="70" r="20" fill="#e8f3ee" stroke="#26383d"/><circle cx="165" cy="70" r="20" fill="#e8f3ee" stroke="#26383d"/></g>
|
||||
<text x="58" y="285" class="small">10 objets, 6 sont choisis</text></g>
|
||||
<g transform="translate(170 645)"><rect width="1260" height="110" rx="24" class="panel"/><text x="36" y="48" class="h2">À retenir</text><text x="36" y="86" class="body">Une fraction n'a de sens que si l'unité et les parts égales sont claires.</text></g>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4" />
|
||||
<g transform="translate(110 245)">
|
||||
<rect width="420" height="330" rx="24" class="panel" />
|
||||
<g class="math-expression">
|
||||
<text x="34" y="58" class="h2">Bande : </text>
|
||||
<g transform="translate(159.44 58)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">3</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">5</text>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(45 132)">
|
||||
<rect width="320" height="92" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="64" height="92" rx="12" class="orange" />
|
||||
<rect x="64" width="64" height="92" class="orange" />
|
||||
<rect x="128" width="64" height="92" class="orange" />
|
||||
<line x1="64" y1="0" x2="64" y2="92" class="line" />
|
||||
<line x1="128" y1="0" x2="128" y2="92" class="line" />
|
||||
<line x1="192" y1="0" x2="192" y2="92" class="line" />
|
||||
<line x1="256" y1="0" x2="256" y2="92" class="line" />
|
||||
</g>
|
||||
<text x="45" y="285" class="small">5 parts égales, 3 parts coloriées</text>
|
||||
</g>
|
||||
<g transform="translate(590 245)">
|
||||
<rect width="420" height="330" rx="24" class="soft" />
|
||||
<g class="math-expression">
|
||||
<text x="34" y="58" class="h2">Disque : </text>
|
||||
<g transform="translate(175.12 58)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">1</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">4</text>
|
||||
</g>
|
||||
</g>
|
||||
<circle cx="210" cy="178" r="90" fill="#f7fbf9" stroke="#26383d" stroke-width="4" />
|
||||
<path d="M210 178 L210 88 A90 90 0 0 1 300 178 Z" class="blue" />
|
||||
<line x1="210" y1="88" x2="210" y2="268" class="line" />
|
||||
<line x1="120" y1="178" x2="300" y2="178" class="line" />
|
||||
<text x="70" y="285" class="small">4 parts égales, 1 part coloriée</text>
|
||||
</g>
|
||||
<g transform="translate(1070 245)">
|
||||
<rect width="420" height="330" rx="24" class="panel" />
|
||||
<g class="math-expression">
|
||||
<text x="34" y="58" class="h2">Collection : </text>
|
||||
<g transform="translate(237.84 58)" class="fraction-g">
|
||||
<text x="30" y="-21" text-anchor="middle" class="h2">6</text>
|
||||
<line x1="0" y1="4" x2="60" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="30" y="39" text-anchor="middle" class="h2">10</text>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(70 112)">
|
||||
<circle cx="0" cy="0" r="20" class="green" />
|
||||
<circle cx="55" cy="0" r="20" class="green" />
|
||||
<circle cx="110" cy="0" r="20" class="green" />
|
||||
<circle cx="165" cy="0" r="20" class="green" />
|
||||
<circle cx="220" cy="0" r="20" class="green" />
|
||||
<circle cx="275" cy="0" r="20" class="green" />
|
||||
<circle cx="0" cy="70" r="20" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="55" cy="70" r="20" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="110" cy="70" r="20" fill="#e8f3ee" stroke="#26383d" />
|
||||
<circle cx="165" cy="70" r="20" fill="#e8f3ee" stroke="#26383d" />
|
||||
</g>
|
||||
<text x="58" y="285" class="small">10 objets, 6 sont choisis</text>
|
||||
</g>
|
||||
<g transform="translate(170 645)">
|
||||
<rect width="1260" height="110" rx="24" class="panel" />
|
||||
<text x="36" y="48" class="h2">À retenir</text>
|
||||
<text x="36" y="86" class="body">Une fraction n'a de sens que si l'unité et les parts égales sont claires.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 4.5 KiB After Width: | Height: | Size: 4.9 KiB |
@@ -1,19 +1,60 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.orange{fill:#e78232}.blue{fill:#1d78b5}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.tick{stroke:#26383d;stroke-width:3}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.orange{fill:#e78232}.blue{fill:#1d78b5}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.tick{stroke:#26383d;stroke-width:3}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Placer une fraction sur une demi-droite</text>
|
||||
<text x="800" y="160" text-anchor="middle" class="subtitle">Je partage chaque unité selon le dénominateur</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4"/>
|
||||
<g transform="translate(125 255)"><rect width="1350" height="340" rx="24" class="soft"/><g class="math-expression"><text x="36" y="60" class="h2">Exemple : placer </text><g transform="translate(302.56 60)" class="fraction-g"><text x="17" y="-24" text-anchor="middle" class="h2">5</text><line x1="0" y1="4" x2="34" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="17" y="42" text-anchor="middle" class="h2">4</text></g></g>
|
||||
<line x1="100" y1="205" x2="1180" y2="205" class="line"/><path d="M1180 205 L1158 194 L1158 216 Z" fill="#26383d"/>
|
||||
<g transform="translate(130 0)">
|
||||
<line x1="0" y1="170" x2="0" y2="240" class="tick"/><text x="0" y="275" text-anchor="middle" class="body">0</text>
|
||||
<line x1="250" y1="170" x2="250" y2="240" class="tick"/><text x="250" y="275" text-anchor="middle" class="body">1</text>
|
||||
<line x1="500" y1="170" x2="500" y2="240" class="tick"/><text x="500" y="275" text-anchor="middle" class="body">2</text>
|
||||
<line x1="62.5" y1="184" x2="62.5" y2="226" class="tick"/><line x1="125" y1="184" x2="125" y2="226" class="tick"/><line x1="187.5" y1="184" x2="187.5" y2="226" class="tick"/><line x1="312.5" y1="184" x2="312.5" y2="226" class="tick"/><line x1="375" y1="184" x2="375" y2="226" class="tick"/><line x1="437.5" y1="184" x2="437.5" y2="226" class="tick"/>
|
||||
<circle cx="312.5" cy="205" r="16" class="orange"/><g class="math-expression"><g transform="translate(295.5 150)" class="fraction-g"><text x="16" y="-18" text-anchor="middle" class="body">5</text><line x1="0" y1="3" x2="32" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="16" y="34" text-anchor="middle" class="body">4</text></g></g>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4" />
|
||||
<g transform="translate(125 255)">
|
||||
<rect width="1350" height="340" rx="24" class="soft" />
|
||||
<g class="math-expression">
|
||||
<text x="36" y="60" class="h2">Exemple : placer </text>
|
||||
<g transform="translate(302.56 60)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">5</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">4</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="100" y1="205" x2="1180" y2="205" class="line" />
|
||||
<path d="M1180 205 L1158 194 L1158 216 Z" fill="#26383d" />
|
||||
<g transform="translate(130 0)">
|
||||
<line x1="0" y1="170" x2="0" y2="240" class="tick" />
|
||||
<text x="0" y="275" text-anchor="middle" class="body">0</text>
|
||||
<line x1="250" y1="170" x2="250" y2="240" class="tick" />
|
||||
<text x="250" y="275" text-anchor="middle" class="body">1</text>
|
||||
<line x1="500" y1="170" x2="500" y2="240" class="tick" />
|
||||
<text x="500" y="275" text-anchor="middle" class="body">2</text>
|
||||
<line x1="62.5" y1="184" x2="62.5" y2="226" class="tick" />
|
||||
<line x1="125" y1="184" x2="125" y2="226" class="tick" />
|
||||
<line x1="187.5" y1="184" x2="187.5" y2="226" class="tick" />
|
||||
<line x1="312.5" y1="184" x2="312.5" y2="226" class="tick" />
|
||||
<line x1="375" y1="184" x2="375" y2="226" class="tick" />
|
||||
<line x1="437.5" y1="184" x2="437.5" y2="226" class="tick" />
|
||||
<circle cx="312.5" cy="205" r="16" class="orange" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(295.5 150)" class="fraction-g">
|
||||
<text x="19" y="-18" text-anchor="middle" class="body">5</text>
|
||||
<line x1="0" y1="3" x2="38" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="19" y="34" text-anchor="middle" class="body">4</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<text x="820" y="150" class="body">Dénominateur 4 :</text>
|
||||
<text x="820" y="190" class="body">chaque unité a 4 parts.</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(820 245)" class="fraction-g">
|
||||
<text x="19" y="-18" text-anchor="middle" class="body">5</text>
|
||||
<line x1="0" y1="3" x2="38" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="19" y="34" text-anchor="middle" class="body">4</text>
|
||||
</g>
|
||||
<text x="854" y="245" class="body"> est juste après 1.</text>
|
||||
</g>
|
||||
<text x="820" y="150" class="body">Dénominateur 4 :</text><text x="820" y="190" class="body">chaque unité a 4 parts.</text><g class="math-expression"><g transform="translate(820 245)" class="fraction-g"><text x="16" y="-18" text-anchor="middle" class="body">5</text><line x1="0" y1="3" x2="32" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="16" y="34" text-anchor="middle" class="body">4</text></g><text x="854" y="245" class="body"> est juste après 1.</text></g>
|
||||
</g>
|
||||
<g transform="translate(170 650)"><rect width="1260" height="110" rx="24" class="panel"/><text x="36" y="48" class="h2">À retenir</text><text x="36" y="86" class="body">L'intervalle de 0 à 1 est l'unité. Je le partage en parts égales.</text></g>
|
||||
<g transform="translate(170 650)">
|
||||
<rect width="1260" height="110" rx="24" class="panel" />
|
||||
<text x="36" y="48" class="h2">À retenir</text>
|
||||
<text x="36" y="86" class="body">L'intervalle de 0 à 1 est l'unité. Je le partage en parts égales.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 4.1 KiB |
@@ -1,4 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs>
|
||||
<style>
|
||||
.bg{fill:#f6f5ef}
|
||||
@@ -16,85 +16,79 @@
|
||||
.frac-line{stroke:#074f4b;stroke-width:4;stroke-linecap:round}
|
||||
.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900"/>
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Fraction supérieure à 1</text>
|
||||
<text x="800" y="160" text-anchor="middle" class="subtitle">Quand le numérateur dépasse le dénominateur</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4"/>
|
||||
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4" />
|
||||
<g transform="translate(120 245)">
|
||||
<rect width="630" height="360" rx="24" class="soft"/>
|
||||
<rect width="630" height="360" rx="24" class="soft" />
|
||||
<text x="34" y="66" class="h2">Exemple :</text>
|
||||
<g transform="translate(225 62)">
|
||||
<text x="18" y="-18" text-anchor="middle" class="h2">7</text>
|
||||
<line x1="0" y1="4" x2="36" y2="4" class="frac-line"/>
|
||||
<text x="18" y="34" text-anchor="middle" class="h2">4</text>
|
||||
<g transform="translate(225 62)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">7</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" class="frac-line" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">4</text>
|
||||
</g>
|
||||
<g transform="translate(70 130)">
|
||||
<rect width="400" height="80" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/>
|
||||
<rect width="100" height="80" rx="12" class="green"/>
|
||||
<rect x="100" width="100" height="80" class="green"/>
|
||||
<rect x="200" width="100" height="80" class="green"/>
|
||||
<rect x="300" width="100" height="80" class="green"/>
|
||||
<line x1="100" y1="0" x2="100" y2="80" class="line"/>
|
||||
<line x1="200" y1="0" x2="200" y2="80" class="line"/>
|
||||
<line x1="300" y1="0" x2="300" y2="80" class="line"/>
|
||||
<rect width="400" height="80" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="100" height="80" rx="12" class="green" />
|
||||
<rect x="100" width="100" height="80" class="green" />
|
||||
<rect x="200" width="100" height="80" class="green" />
|
||||
<rect x="300" width="100" height="80" class="green" />
|
||||
<line x1="100" y1="0" x2="100" y2="80" class="line" />
|
||||
<line x1="200" y1="0" x2="200" y2="80" class="line" />
|
||||
<line x1="300" y1="0" x2="300" y2="80" class="line" />
|
||||
</g>
|
||||
<g transform="translate(70 245)">
|
||||
<rect width="400" height="80" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/>
|
||||
<rect width="100" height="80" rx="12" class="orange"/>
|
||||
<rect x="100" width="100" height="80" class="orange"/>
|
||||
<rect x="200" width="100" height="80" class="orange"/>
|
||||
<line x1="100" y1="0" x2="100" y2="80" class="line"/>
|
||||
<line x1="200" y1="0" x2="200" y2="80" class="line"/>
|
||||
<line x1="300" y1="0" x2="300" y2="80" class="line"/>
|
||||
<rect width="400" height="80" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="100" height="80" rx="12" class="orange" />
|
||||
<rect x="100" width="100" height="80" class="orange" />
|
||||
<rect x="200" width="100" height="80" class="orange" />
|
||||
<line x1="100" y1="0" x2="100" y2="80" class="line" />
|
||||
<line x1="200" y1="0" x2="200" y2="80" class="line" />
|
||||
<line x1="300" y1="0" x2="300" y2="80" class="line" />
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g transform="translate(815 245)">
|
||||
<rect width="635" height="360" rx="24" class="panel"/>
|
||||
<rect width="635" height="360" rx="24" class="panel" />
|
||||
<text x="36" y="60" class="h2">Je décompose</text>
|
||||
|
||||
<g transform="translate(70 125)">
|
||||
<g>
|
||||
<text x="18" y="-18" text-anchor="middle" class="num">7</text>
|
||||
<line x1="0" y1="4" x2="36" y2="4" class="frac-line"/>
|
||||
<text x="18" y="52" text-anchor="middle" class="num">4</text>
|
||||
<g class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">7</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" class="frac-line" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
<text x="70" y="18" class="op">=</text>
|
||||
<g transform="translate(125 0)">
|
||||
<text x="18" y="-18" text-anchor="middle" class="num">4</text>
|
||||
<line x1="0" y1="4" x2="36" y2="4" class="frac-line"/>
|
||||
<text x="18" y="52" text-anchor="middle" class="num">4</text>
|
||||
<g transform="translate(125 0)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">4</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" class="frac-line" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
<text x="195" y="18" class="op">+</text>
|
||||
<g transform="translate(250 0)">
|
||||
<text x="18" y="-18" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="4" x2="36" y2="4" class="frac-line"/>
|
||||
<text x="18" y="52" text-anchor="middle" class="num">4</text>
|
||||
<g transform="translate(250 0)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" class="frac-line" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g transform="translate(70 205)">
|
||||
<g>
|
||||
<text x="18" y="-18" text-anchor="middle" class="num">7</text>
|
||||
<line x1="0" y1="4" x2="36" y2="4" class="frac-line"/>
|
||||
<text x="18" y="52" text-anchor="middle" class="num">4</text>
|
||||
<g class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">7</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" class="frac-line" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
<text x="70" y="18" class="op">= 1 +</text>
|
||||
<g transform="translate(205 0)">
|
||||
<text x="18" y="-18" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="4" x2="36" y2="4" class="frac-line"/>
|
||||
<text x="18" y="52" text-anchor="middle" class="num">4</text>
|
||||
<g transform="translate(205 0)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" class="frac-line" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<text x="70" y="292" class="body">La première unité est complète.</text>
|
||||
<text x="70" y="328" class="body">Il reste encore trois quarts.</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(170 660)">
|
||||
<rect width="1260" height="105" rx="24" class="panel"/>
|
||||
<rect width="1260" height="105" rx="24" class="panel" />
|
||||
<text x="36" y="47" class="h2">À retenir</text>
|
||||
<text x="36" y="84" class="body">Une fraction peut être plus grande que 1 : il faut alors utiliser plusieurs unités.</text>
|
||||
</g>
|
||||
|
||||
|
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.5 KiB |
@@ -1,16 +1,73 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:64px;font-weight:800;fill:#074f4b}.orange{fill:#e78232}.blue{fill:#1d78b5}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:64px;font-weight:800;fill:#074f4b}.orange{fill:#e78232}.blue{fill:#1d78b5}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Comparer des fractions simples</text>
|
||||
<text x="800" y="160" text-anchor="middle" class="subtitle">Même unité, parts égales, puis je compare</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4"/>
|
||||
<g transform="translate(120 245)"><rect width="620" height="360" rx="24" class="soft"/><text x="34" y="60" class="h2">Même dénominateur</text>
|
||||
<g class="math-expression"><g transform="translate(70 130)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">3</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">5</text></g><text x="122.44" y="130" class="num"> < </text><g transform="translate(199.72 130)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">4</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">5</text></g></g>
|
||||
<g transform="translate(75 175)"><rect width="430" height="58" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><rect width="86" height="58" rx="10" class="orange"/><rect x="86" width="86" height="58" class="orange"/><rect x="172" width="86" height="58" class="orange"/><line x1="86" y1="0" x2="86" y2="58" class="line"/><line x1="172" y1="0" x2="172" y2="58" class="line"/><line x1="258" y1="0" x2="258" y2="58" class="line"/><line x1="344" y1="0" x2="344" y2="58" class="line"/></g>
|
||||
<g transform="translate(75 265)"><rect width="430" height="58" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><rect width="86" height="58" rx="10" class="blue"/><rect x="86" width="86" height="58" class="blue"/><rect x="172" width="86" height="58" class="blue"/><rect x="258" width="86" height="58" class="blue"/><line x1="86" y1="0" x2="86" y2="58" class="line"/><line x1="172" y1="0" x2="172" y2="58" class="line"/><line x1="258" y1="0" x2="258" y2="58" class="line"/><line x1="344" y1="0" x2="344" y2="58" class="line"/></g>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4" />
|
||||
<g transform="translate(120 245)">
|
||||
<rect width="620" height="360" rx="24" class="soft" />
|
||||
<text x="34" y="60" class="h2">Même dénominateur</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(70 130)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
<text x="122.44" y="156" class="num"> < </text>
|
||||
<g transform="translate(199.72 130)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">4</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">5</text>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(75 175)">
|
||||
<rect width="430" height="58" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="86" height="58" rx="10" class="orange" />
|
||||
<rect x="86" width="86" height="58" class="orange" />
|
||||
<rect x="172" width="86" height="58" class="orange" />
|
||||
<line x1="86" y1="0" x2="86" y2="58" class="line" />
|
||||
<line x1="172" y1="0" x2="172" y2="58" class="line" />
|
||||
<line x1="258" y1="0" x2="258" y2="58" class="line" />
|
||||
<line x1="344" y1="0" x2="344" y2="58" class="line" />
|
||||
</g>
|
||||
<g transform="translate(75 265)">
|
||||
<rect width="430" height="58" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="86" height="58" rx="10" class="blue" />
|
||||
<rect x="86" width="86" height="58" class="blue" />
|
||||
<rect x="172" width="86" height="58" class="blue" />
|
||||
<rect x="258" width="86" height="58" class="blue" />
|
||||
<line x1="86" y1="0" x2="86" y2="58" class="line" />
|
||||
<line x1="172" y1="0" x2="172" y2="58" class="line" />
|
||||
<line x1="258" y1="0" x2="258" y2="58" class="line" />
|
||||
<line x1="344" y1="0" x2="344" y2="58" class="line" />
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(815 245)"><rect width="635" height="360" rx="24" class="panel"/><text x="36" y="60" class="h2">Même numérateur</text>
|
||||
<g class="math-expression"><g transform="translate(70 130)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">1</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">2</text></g><text x="122.44" y="130" class="num"> > </text><g transform="translate(199.72 130)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">1</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">4</text></g></g><text x="70" y="195" class="body">Quand on partage en plus de parts,</text><text x="70" y="232" class="body">chaque part est plus petite.</text><text x="70" y="300" class="body">Toujours comparer la même unité.</text>
|
||||
<g transform="translate(815 245)">
|
||||
<rect width="635" height="360" rx="24" class="panel" />
|
||||
<text x="36" y="60" class="h2">Même numérateur</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(70 130)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">1</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">2</text>
|
||||
</g>
|
||||
<text x="122.44" y="156" class="num"> > </text>
|
||||
<g transform="translate(199.72 130)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">1</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">4</text>
|
||||
</g>
|
||||
</g>
|
||||
<text x="70" y="195" class="body">Quand on partage en plus de parts,</text>
|
||||
<text x="70" y="232" class="body">chaque part est plus petite.</text>
|
||||
<text x="70" y="300" class="body">Toujours comparer la même unité.</text>
|
||||
</g>
|
||||
<g transform="translate(170 660)">
|
||||
<rect width="1260" height="105" rx="24" class="panel" />
|
||||
<text x="36" y="47" class="h2">À retenir</text>
|
||||
<text x="36" y="84" class="body">À dénominateur égal, le plus grand numérateur donne la plus grande fraction.</text>
|
||||
</g>
|
||||
<g transform="translate(170 660)"><rect width="1260" height="105" rx="24" class="panel"/><text x="36" y="47" class="h2">À retenir</text><text x="36" y="84" class="body">À dénominateur égal, le plus grand numérateur donne la plus grande fraction.</text></g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 4.5 KiB After Width: | Height: | Size: 4.9 KiB |
@@ -1,13 +1,72 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:54px;font-weight:800;fill:#074f4b}.orange{fill:#e78232}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.tick{stroke:#26383d;stroke-width:3}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Ençadrer une fraction</text>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:54px;font-weight:800;fill:#074f4b}.orange{fill:#e78232}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.tick{stroke:#26383d;stroke-width:3}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Encadrer une fraction</text>
|
||||
<text x="800" y="160" text-anchor="middle" class="subtitle">Je cherche entre quels entiers elle se trouve</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4"/>
|
||||
<g transform="translate(125 245)"><rect width="1350" height="360" rx="24" class="soft"/><g class="math-expression"><text x="36" y="60" class="h2">Exemple : </text><g transform="translate(192.8 60)" class="fraction-g"><text x="17" y="-24" text-anchor="middle" class="h2">7</text><line x1="0" y1="4" x2="34" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="17" y="42" text-anchor="middle" class="h2">3</text></g></g>
|
||||
<g class="math-expression"><g transform="translate(790 125)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">6</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">3</text></g><text x="842.44" y="125" class="num"> = 2</text></g><g class="math-expression"><g transform="translate(790 195)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">9</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">3</text></g><text x="842.44" y="195" class="num"> = 3</text></g><g class="math-expression"><text x="790" y="270" class="num">2 < </text><g transform="translate(893.04 270)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">7</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">3</text></g><text x="945.48" y="270" class="num"> < 3</text></g>
|
||||
<line x1="100" y1="230" x2="670" y2="230" class="line"/><path d="M670 230 L648 219 L648 241 Z" fill="#26383d"/>
|
||||
<g transform="translate(120 0)"><line x1="0" y1="195" x2="0" y2="265" class="tick"/><text x="0" y="300" text-anchor="middle" class="body">0</text><line x1="150" y1="195" x2="150" y2="265" class="tick"/><text x="150" y="300" text-anchor="middle" class="body">1</text><line x1="300" y1="195" x2="300" y2="265" class="tick"/><text x="300" y="300" text-anchor="middle" class="body">2</text><line x1="450" y1="195" x2="450" y2="265" class="tick"/><text x="450" y="300" text-anchor="middle" class="body">3</text><line x1="350" y1="210" x2="350" y2="250" class="tick"/><circle cx="350" cy="230" r="15" class="orange"/><g class="math-expression"><g transform="translate(333 175)" class="fraction-g"><text x="16" y="-18" text-anchor="middle" class="body">7</text><line x1="0" y1="3" x2="32" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="16" y="34" text-anchor="middle" class="body">3</text></g></g></g>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4" />
|
||||
<g transform="translate(125 245)">
|
||||
<rect width="1350" height="360" rx="24" class="soft" />
|
||||
<g class="math-expression">
|
||||
<text x="36" y="60" class="h2">Exemple : </text>
|
||||
<g transform="translate(192.8 60)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">7</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">3</text>
|
||||
</g>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(790 125)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">6</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">3</text>
|
||||
</g>
|
||||
<text x="842.44" y="151" class="num"> = 2</text>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(790 195)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">9</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">3</text>
|
||||
</g>
|
||||
<text x="842.44" y="221" class="num"> = 3</text>
|
||||
</g>
|
||||
<g class="math-expression">
|
||||
<text x="790" y="296" class="num">2 < </text>
|
||||
<g transform="translate(893.04 270)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">7</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">3</text>
|
||||
</g>
|
||||
<text x="945.48" y="296" class="num"> < 3</text>
|
||||
</g>
|
||||
<line x1="100" y1="230" x2="670" y2="230" class="line" />
|
||||
<path d="M670 230 L648 219 L648 241 Z" fill="#26383d" />
|
||||
<g transform="translate(120 0)">
|
||||
<line x1="0" y1="195" x2="0" y2="265" class="tick" />
|
||||
<text x="0" y="300" text-anchor="middle" class="body">0</text>
|
||||
<line x1="150" y1="195" x2="150" y2="265" class="tick" />
|
||||
<text x="150" y="300" text-anchor="middle" class="body">1</text>
|
||||
<line x1="300" y1="195" x2="300" y2="265" class="tick" />
|
||||
<text x="300" y="300" text-anchor="middle" class="body">2</text>
|
||||
<line x1="450" y1="195" x2="450" y2="265" class="tick" />
|
||||
<text x="450" y="300" text-anchor="middle" class="body">3</text>
|
||||
<line x1="350" y1="210" x2="350" y2="250" class="tick" />
|
||||
<circle cx="350" cy="230" r="15" class="orange" />
|
||||
<g class="math-expression">
|
||||
<g transform="translate(333 175)" class="fraction-g">
|
||||
<text x="19" y="-18" text-anchor="middle" class="body">7</text>
|
||||
<line x1="0" y1="3" x2="38" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="19" y="34" text-anchor="middle" class="body">3</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(170 660)">
|
||||
<rect width="1260" height="105" rx="24" class="panel" />
|
||||
<text x="36" y="47" class="h2">À retenir</text>
|
||||
<text x="36" y="84" class="body">Je compare la fraction aux fractions qui valent les entiers voisins.</text>
|
||||
</g>
|
||||
<g transform="translate(170 660)"><rect width="1260" height="105" rx="24" class="panel"/><text x="36" y="47" class="h2">À retenir</text><text x="36" y="84" class="body">Je compare la fraction aux fractions qui valent les entiers voisins.</text></g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.6 KiB |
@@ -1,12 +1,78 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.orange{fill:#e78232}.blue{fill:#1d78b5}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.orange{fill:#e78232}.blue{fill:#1d78b5}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Additionner des fractions simples</text>
|
||||
<text x="800" y="160" text-anchor="middle" class="subtitle">Si les dénominateurs sont les mêmes, les parts ont la même taille</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4"/>
|
||||
<g transform="translate(120 245)"><rect width="640" height="360" rx="24" class="soft"/><text x="34" y="60" class="h2">Exemple</text><g class="math-expression"><g transform="translate(80 130)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">2</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">7</text></g><text x="132.44" y="130" class="num"> + </text><g transform="translate(209.72 130)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">3</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">7</text></g><text x="262.16" y="130" class="num"> = </text><g transform="translate(339.44 130)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">5</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">7</text></g></g>
|
||||
<g transform="translate(70 210)"><rect width="490" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><rect width="70" height="70" rx="10" class="orange"/><rect x="70" width="70" height="70" class="orange"/><rect x="140" width="70" height="70" class="blue"/><rect x="210" width="70" height="70" class="blue"/><rect x="280" width="70" height="70" class="blue"/><line x1="70" y1="0" x2="70" y2="70" class="line"/><line x1="140" y1="0" x2="140" y2="70" class="line"/><line x1="210" y1="0" x2="210" y2="70" class="line"/><line x1="280" y1="0" x2="280" y2="70" class="line"/><line x1="350" y1="0" x2="350" y2="70" class="line"/><line x1="420" y1="0" x2="420" y2="70" class="line"/></g>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4" />
|
||||
<g transform="translate(120 245)">
|
||||
<rect width="640" height="360" rx="24" class="soft" />
|
||||
<text x="34" y="60" class="h2">Exemple</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(80 130)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">7</text>
|
||||
</g>
|
||||
<text x="132.44" y="156" class="num"> + </text>
|
||||
<g transform="translate(209.72 130)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">3</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">7</text>
|
||||
</g>
|
||||
<text x="262.16" y="156" class="num"> = </text>
|
||||
<g transform="translate(339.44 130)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">5</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">7</text>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(70 210)">
|
||||
<rect width="490" height="70" rx="10" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="70" height="70" rx="10" class="orange" />
|
||||
<rect x="70" width="70" height="70" class="orange" />
|
||||
<rect x="140" width="70" height="70" class="blue" />
|
||||
<rect x="210" width="70" height="70" class="blue" />
|
||||
<rect x="280" width="70" height="70" class="blue" />
|
||||
<line x1="70" y1="0" x2="70" y2="70" class="line" />
|
||||
<line x1="140" y1="0" x2="140" y2="70" class="line" />
|
||||
<line x1="210" y1="0" x2="210" y2="70" class="line" />
|
||||
<line x1="280" y1="0" x2="280" y2="70" class="line" />
|
||||
<line x1="350" y1="0" x2="350" y2="70" class="line" />
|
||||
<line x1="420" y1="0" x2="420" y2="70" class="line" />
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(825 245)">
|
||||
<rect width="625" height="360" rx="24" class="panel" />
|
||||
<text x="36" y="60" class="h2">La règle</text>
|
||||
<text x="65" y="135" class="body">Je garde le dénominateur.</text>
|
||||
<text x="65" y="180" class="body">J'ajoute ou je retire</text>
|
||||
<text x="65" y="218" class="body">seulement les numérateurs.</text>
|
||||
<g class="math-expression">
|
||||
<g transform="translate(65 290)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">6</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">8</text>
|
||||
</g>
|
||||
<text x="117.44" y="316" class="num"> - </text>
|
||||
<g transform="translate(194.72 290)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">2</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">8</text>
|
||||
</g>
|
||||
<text x="247.16" y="316" class="num"> = </text>
|
||||
<g transform="translate(324.44 290)" class="fraction-g">
|
||||
<text x="26" y="-28" text-anchor="middle" class="num" font-size="42">4</text>
|
||||
<line x1="0" y1="5" x2="52" y2="5" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="26" y="54" text-anchor="middle" class="num">8</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(170 660)">
|
||||
<rect width="1260" height="105" rx="24" class="panel" />
|
||||
<text x="36" y="47" class="h2">À retenir</text>
|
||||
<text x="36" y="84" class="body">Avant de calculer, je vérifie que les dénominateurs sont identiques.</text>
|
||||
</g>
|
||||
<g transform="translate(825 245)"><rect width="625" height="360" rx="24" class="panel"/><text x="36" y="60" class="h2">La règle</text><text x="65" y="135" class="body">Je garde le dénominateur.</text><text x="65" y="180" class="body">J'ajoute ou je retire</text><text x="65" y="218" class="body">seulement les numérateurs.</text><g class="math-expression"><g transform="translate(65 290)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">6</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">8</text></g><text x="117.44" y="290" class="num"> - </text><g transform="translate(194.72 290)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">2</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">8</text></g><text x="247.16" y="290" class="num"> = </text><g transform="translate(324.44 290)" class="fraction-g"><text x="18" y="-24" text-anchor="middle" class="num" font-size="42">4</text><line x1="0" y1="4" x2="36" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="18" y="52" text-anchor="middle" class="num">8</text></g></g></g>
|
||||
<g transform="translate(170 660)"><rect width="1260" height="105" rx="24" class="panel"/><text x="36" y="47" class="h2">À retenir</text><text x="36" y="84" class="body">Avant de calculer, je vérifie que les dénominateurs sont identiques.</text></g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 4.8 KiB After Width: | Height: | Size: 5.2 KiB |
@@ -1,13 +1,54 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs><style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.orange{fill:#e78232}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style></defs>
|
||||
<rect class="bg" width="1600" height="900"/><rect x="56" y="42" width="1488" height="816" rx="34" class="panel"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
|
||||
<defs>
|
||||
<style>.bg{fill:#f6f5ef}.panel{fill:#fff;stroke:#e2ebe6;stroke-width:2;filter:drop-shadow(0 10px 24px rgba(22,42,45,.10))}.soft{fill:#eef7f4;stroke:#c9dfd8;stroke-width:2}.title{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.subtitle{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:26px;font-weight:700;fill:#1e3540}.h2{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:30px;font-weight:800;fill:#074f4b}.body{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:24px;fill:#1d3038}.num{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:58px;font-weight:800;fill:#074f4b}.small{font-family:"Trebuchet MS",Verdana,sans-serif;font-size:19px;fill:#2d4148}.orange{fill:#e78232}.green{fill:#2f9246}.line{stroke:#26383d;stroke-width:4;stroke-linecap:round}.fraction-g .num{font-size:38px}.fraction-g .h2{font-size:28px}.fraction-g .body{font-size:22px}.fraction-g line{stroke-width:3}</style>
|
||||
</defs>
|
||||
<rect class="bg" width="1600" height="900" />
|
||||
<rect x="56" y="42" width="1488" height="816" rx="34" class="panel" />
|
||||
<text x="800" y="116" text-anchor="middle" class="title">Trouver une fraction d'une quantité</text>
|
||||
<text x="800" y="160" text-anchor="middle" class="subtitle">Je partage, puis je prends les parts demandées</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4"/>
|
||||
<g transform="translate(120 245)"><rect width="640" height="360" rx="24" class="soft"/><g class="math-expression"><text x="34" y="60" class="h2">Exemple : </text><g transform="translate(190.8 60)" class="fraction-g"><text x="17" y="-24" text-anchor="middle" class="h2">3</text><line x1="0" y1="4" x2="34" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="17" y="42" text-anchor="middle" class="h2">4</text></g><text x="224.8" y="60" class="h2"> de 20</text></g>
|
||||
<g transform="translate(80 125)"><rect width="440" height="90" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3"/><rect width="110" height="90" rx="12" class="orange"/><rect x="110" width="110" height="90" class="orange"/><rect x="220" width="110" height="90" class="orange"/><line x1="110" y1="0" x2="110" y2="90" class="line"/><line x1="220" y1="0" x2="220" y2="90" class="line"/><line x1="330" y1="0" x2="330" y2="90" class="line"/></g>
|
||||
<text x="80" y="270" class="body">20 partage en 4 parts : chaque part vaut 5.</text><text x="80" y="315" class="body">Je prends 3 parts : 15.</text>
|
||||
<line x1="430" y1="194" x2="1170" y2="194" stroke="#dbe8e3" stroke-width="4" />
|
||||
<g transform="translate(120 245)">
|
||||
<rect width="640" height="360" rx="24" class="soft" />
|
||||
<g class="math-expression">
|
||||
<text x="34" y="60" class="h2">Exemple : </text>
|
||||
<g transform="translate(190.8 60)" class="fraction-g">
|
||||
<text x="21" y="-21" text-anchor="middle" class="h2">3</text>
|
||||
<line x1="0" y1="4" x2="42" y2="4" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="21" y="39" text-anchor="middle" class="h2">4</text>
|
||||
</g>
|
||||
<text x="224.8" y="77" class="h2"> de 20</text>
|
||||
</g>
|
||||
<g transform="translate(80 125)">
|
||||
<rect width="440" height="90" rx="12" fill="#f7fbf9" stroke="#26383d" stroke-width="3" />
|
||||
<rect width="110" height="90" rx="12" class="orange" />
|
||||
<rect x="110" width="110" height="90" class="orange" />
|
||||
<rect x="220" width="110" height="90" class="orange" />
|
||||
<line x1="110" y1="0" x2="110" y2="90" class="line" />
|
||||
<line x1="220" y1="0" x2="220" y2="90" class="line" />
|
||||
<line x1="330" y1="0" x2="330" y2="90" class="line" />
|
||||
</g>
|
||||
<text x="80" y="270" class="body">20 partage en 4 parts : chaque part vaut 5.</text>
|
||||
<text x="80" y="315" class="body">Je prends 3 parts : 15.</text>
|
||||
</g>
|
||||
<g transform="translate(825 245)">
|
||||
<rect width="625" height="360" rx="24" class="panel" />
|
||||
<text x="36" y="60" class="h2">La méthode</text>
|
||||
<text x="70" y="130" class="num">20 ÷ 4 = 5</text>
|
||||
<text x="70" y="205" class="num">5 x 3 = 15</text>
|
||||
<text x="70" y="285" class="body">Le dénominateur partage.</text>
|
||||
<text x="70" y="323" class="body">Le numérateur dit combien prendre.</text>
|
||||
</g>
|
||||
<g transform="translate(170 660)">
|
||||
<rect width="1260" height="105" rx="24" class="panel" />
|
||||
<text x="36" y="47" class="h2">À retenir</text>
|
||||
<g class="math-expression">
|
||||
<text x="36" y="84" class="body">Pour trouver </text>
|
||||
<g transform="translate(210.72 84)" class="fraction-g">
|
||||
<text x="19" y="-18" text-anchor="middle" class="body">3</text>
|
||||
<line x1="0" y1="3" x2="38" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round" />
|
||||
<text x="19" y="34" text-anchor="middle" class="body">4</text>
|
||||
</g>
|
||||
<text x="244.72" y="97" class="body"> d'une quantité : je divise par 4, puis je multiplie par 3.</text>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(825 245)"><rect width="625" height="360" rx="24" class="panel"/><text x="36" y="60" class="h2">La méthode</text><text x="70" y="130" class="num">20 ÷ 4 = 5</text><text x="70" y="205" class="num">5 x 3 = 15</text><text x="70" y="285" class="body">Le dénominateur partage.</text><text x="70" y="323" class="body">Le numérateur dit combien prendre.</text></g>
|
||||
<g transform="translate(170 660)"><rect width="1260" height="105" rx="24" class="panel"/><text x="36" y="47" class="h2">À retenir</text><g class="math-expression"><text x="36" y="84" class="body">Pour trouver </text><g transform="translate(210.72 84)" class="fraction-g"><text x="16" y="-18" text-anchor="middle" class="body">3</text><line x1="0" y1="3" x2="32" y2="3" stroke="#074f4b" stroke-width="4" stroke-linecap="round"/><text x="16" y="34" text-anchor="middle" class="body">4</text></g><text x="244.72" y="84" class="body"> d'une quantité : je divise par 4, puis je multiplie par 3.</text></g></g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.8 KiB |
260
backend/tools/validate_svg_quality.py
Normal file
260
backend/tools/validate_svg_quality.py
Normal file
@@ -0,0 +1,260 @@
|
||||
from __future__ import annotations
|
||||
|
||||
import argparse
|
||||
import re
|
||||
import sys
|
||||
import xml.etree.ElementTree as ET
|
||||
from dataclasses import dataclass
|
||||
from pathlib import Path
|
||||
|
||||
|
||||
SLASH_FRACTION_RE = re.compile(r"(?<![\w.])\d+\s*/\s*\d+(?![\w.])")
|
||||
MOJIBAKE_RE = re.compile(r"Ã.|Â.|’|“|â€")
|
||||
TRANSLATE_RE = re.compile(r"translate\(\s*([-\d.]+)(?:[\s,]+([-\d.]+))?\s*\)")
|
||||
FONT_SIZE_RE = re.compile(r"font-size\s*:\s*([-\d.]+)px?")
|
||||
CLASS_STYLE_RE = re.compile(r"\.([A-Za-z0-9_-]+)\s*\{([^}]*)\}")
|
||||
FORBIDDEN_TEXT = {
|
||||
"Ençadrer": "Encadrer",
|
||||
}
|
||||
|
||||
|
||||
@dataclass
|
||||
class Issue:
|
||||
severity: str
|
||||
path: Path
|
||||
message: str
|
||||
|
||||
|
||||
def local_name(tag: str) -> str:
|
||||
return tag.rsplit("}", 1)[-1]
|
||||
|
||||
|
||||
def parse_number(value: str | None, default: float = 0.0) -> float:
|
||||
if not value:
|
||||
return default
|
||||
try:
|
||||
return float(value)
|
||||
except ValueError:
|
||||
return default
|
||||
|
||||
|
||||
def node_text(node: ET.Element) -> str:
|
||||
return "".join(node.itertext()).strip()
|
||||
|
||||
|
||||
def class_names(node: ET.Element) -> set[str]:
|
||||
return set((node.attrib.get("class") or "").split())
|
||||
|
||||
|
||||
def has_class(node: ET.Element, name: str) -> bool:
|
||||
return name in class_names(node)
|
||||
|
||||
|
||||
def parse_styles(root: ET.Element) -> dict[str, dict[str, str]]:
|
||||
styles: dict[str, dict[str, str]] = {}
|
||||
for node in root.iter():
|
||||
if local_name(node.tag) != "style":
|
||||
continue
|
||||
text = node.text or ""
|
||||
for match in CLASS_STYLE_RE.finditer(text):
|
||||
declarations: dict[str, str] = {}
|
||||
for declaration in match.group(2).split(";"):
|
||||
if ":" not in declaration:
|
||||
continue
|
||||
key, value = declaration.split(":", 1)
|
||||
declarations[key.strip()] = value.strip()
|
||||
styles[match.group(1)] = declarations
|
||||
return styles
|
||||
|
||||
|
||||
def font_size(node: ET.Element, styles: dict[str, dict[str, str]], default: float = 24.0) -> float:
|
||||
direct = parse_number(node.attrib.get("font-size"), 0)
|
||||
if direct:
|
||||
return direct
|
||||
|
||||
style_attr = node.attrib.get("style") or ""
|
||||
style_match = FONT_SIZE_RE.search(style_attr)
|
||||
if style_match:
|
||||
return parse_number(style_match.group(1), default)
|
||||
|
||||
for class_name in class_names(node):
|
||||
value = styles.get(class_name, {}).get("font-size")
|
||||
if value:
|
||||
return parse_number(value.replace("px", ""), default)
|
||||
return default
|
||||
|
||||
|
||||
def line_width(node: ET.Element) -> float:
|
||||
return abs(parse_number(node.attrib.get("x2")) - parse_number(node.attrib.get("x1")))
|
||||
|
||||
|
||||
def line_y(node: ET.Element) -> float:
|
||||
return (parse_number(node.attrib.get("y1")) + parse_number(node.attrib.get("y2"))) / 2
|
||||
|
||||
|
||||
def text_x(node: ET.Element) -> float:
|
||||
return parse_number(node.attrib.get("x"))
|
||||
|
||||
|
||||
def text_y(node: ET.Element) -> float:
|
||||
return parse_number(node.attrib.get("y"))
|
||||
|
||||
|
||||
def estimated_text_width(text: str, size: float) -> float:
|
||||
# Chiffres scolaires en police sans-serif : estimation volontairement prudente.
|
||||
return max(1, len(text.strip())) * size * 0.62
|
||||
|
||||
|
||||
def validate_fraction_group(path: Path, group: ET.Element, styles: dict[str, dict[str, str]]) -> list[Issue]:
|
||||
issues: list[Issue] = []
|
||||
texts = [node for node in group if local_name(node.tag) == "text"]
|
||||
lines = [node for node in group if local_name(node.tag) == "line"]
|
||||
|
||||
if len(texts) < 2 or not lines:
|
||||
return [
|
||||
Issue(
|
||||
"error",
|
||||
path,
|
||||
"Un groupe fraction-g doit contenir au moins deux textes et une barre horizontale.",
|
||||
)
|
||||
]
|
||||
|
||||
numerator = texts[0]
|
||||
denominator = texts[-1]
|
||||
bar = lines[0]
|
||||
num_y = text_y(numerator)
|
||||
den_y = text_y(denominator)
|
||||
bar_y = line_y(bar)
|
||||
|
||||
if not num_y < bar_y < den_y:
|
||||
issues.append(Issue("error", path, "La barre d'une fraction-g n'est pas entre le numérateur et le dénominateur."))
|
||||
|
||||
num_size = font_size(numerator, styles)
|
||||
den_size = font_size(denominator, styles)
|
||||
min_top_gap = max(8.0, num_size * 0.30)
|
||||
min_bottom_gap = max(8.0, den_size * 0.30)
|
||||
|
||||
if bar_y - num_y < min_top_gap:
|
||||
issues.append(
|
||||
Issue(
|
||||
"warning",
|
||||
path,
|
||||
f"Espace faible entre numérateur et barre ({bar_y - num_y:.1f}px, attendu >= {min_top_gap:.1f}px).",
|
||||
)
|
||||
)
|
||||
if den_y - bar_y < min_bottom_gap:
|
||||
issues.append(
|
||||
Issue(
|
||||
"warning",
|
||||
path,
|
||||
f"Espace faible entre barre et dénominateur ({den_y - bar_y:.1f}px, attendu >= {min_bottom_gap:.1f}px).",
|
||||
)
|
||||
)
|
||||
|
||||
expected_width = max(
|
||||
estimated_text_width(node_text(numerator), num_size),
|
||||
estimated_text_width(node_text(denominator), den_size),
|
||||
)
|
||||
if line_width(bar) < expected_width * 0.95:
|
||||
issues.append(
|
||||
Issue(
|
||||
"warning",
|
||||
path,
|
||||
f"Barre de fraction possiblement trop courte ({line_width(bar):.1f}px pour ~{expected_width:.1f}px de texte).",
|
||||
)
|
||||
)
|
||||
|
||||
center = (parse_number(bar.attrib.get("x1")) + parse_number(bar.attrib.get("x2"))) / 2
|
||||
if abs(text_x(numerator) - center) > 4 or abs(text_x(denominator) - center) > 4:
|
||||
issues.append(Issue("warning", path, "Numérateur ou dénominateur non centré sur la barre de fraction."))
|
||||
|
||||
return issues
|
||||
|
||||
|
||||
def validate_svg(path: Path) -> list[Issue]:
|
||||
issues: list[Issue] = []
|
||||
try:
|
||||
text = path.read_text(encoding="utf-8")
|
||||
root = ET.fromstring(text)
|
||||
except Exception as exc:
|
||||
return [Issue("error", path, f"SVG illisible: {exc}")]
|
||||
|
||||
if local_name(root.tag) != "svg":
|
||||
issues.append(Issue("error", path, "Le fichier n'a pas de racine <svg>."))
|
||||
return issues
|
||||
|
||||
if not root.attrib.get("viewBox"):
|
||||
issues.append(Issue("warning", path, "SVG sans viewBox : recadrage et responsive moins fiables."))
|
||||
|
||||
styles = parse_styles(root)
|
||||
|
||||
for node in root.iter():
|
||||
if local_name(node.tag) == "text":
|
||||
content = node_text(node)
|
||||
for forbidden, expected in FORBIDDEN_TEXT.items():
|
||||
if forbidden in content:
|
||||
issues.append(
|
||||
Issue(
|
||||
"error",
|
||||
path,
|
||||
f"Texte incorrect détecté: {forbidden!r}. Utiliser {expected!r}.",
|
||||
)
|
||||
)
|
||||
if MOJIBAKE_RE.search(content):
|
||||
issues.append(
|
||||
Issue(
|
||||
"error",
|
||||
path,
|
||||
f"Encodage texte suspect dans le SVG: {content!r}.",
|
||||
)
|
||||
)
|
||||
if SLASH_FRACTION_RE.search(content):
|
||||
issues.append(
|
||||
Issue(
|
||||
"error",
|
||||
path,
|
||||
f"Fraction oblique détectée dans un texte SVG: {content!r}. Utiliser une fraction verticale.",
|
||||
)
|
||||
)
|
||||
|
||||
if local_name(node.tag) == "g" and has_class(node, "fraction-g"):
|
||||
issues.extend(validate_fraction_group(path, node, styles))
|
||||
|
||||
return issues
|
||||
|
||||
|
||||
def iter_svg_paths(paths: list[Path]) -> list[Path]:
|
||||
files: list[Path] = []
|
||||
for path in paths:
|
||||
if path.is_file() and path.suffix.lower() == ".svg":
|
||||
files.append(path)
|
||||
elif path.is_dir():
|
||||
files.extend(sorted(path.rglob("*.svg")))
|
||||
return sorted(set(files))
|
||||
|
||||
|
||||
def main() -> int:
|
||||
parser = argparse.ArgumentParser(description="Valide les SVG pédagogiques sensibles.")
|
||||
parser.add_argument("paths", nargs="+", type=Path, help="Fichiers ou dossiers SVG à contrôler.")
|
||||
parser.add_argument("--warnings-as-errors", action="store_true", help="Retourne une erreur si des warnings existent.")
|
||||
args = parser.parse_args()
|
||||
|
||||
all_issues: list[Issue] = []
|
||||
files = iter_svg_paths(args.paths)
|
||||
for path in files:
|
||||
all_issues.extend(validate_svg(path))
|
||||
|
||||
for issue in all_issues:
|
||||
print(f"{issue.severity.upper()} {issue.path}: {issue.message}")
|
||||
|
||||
errors = [issue for issue in all_issues if issue.severity == "error"]
|
||||
warnings = [issue for issue in all_issues if issue.severity == "warning"]
|
||||
print(f"SVG contrôlés: {len(files)} | erreurs: {len(errors)} | warnings: {len(warnings)}")
|
||||
|
||||
if errors or (args.warnings_as_errors and warnings):
|
||||
return 1
|
||||
return 0
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
sys.exit(main())
|
||||
Reference in New Issue
Block a user