[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_26":27,"_28":29,"_30":12,"_31":12,"_32":12,"_33":29,"_34":12,"_35":12,"_36":12,"_37":12,"_38":-5,"_39":40},"routes/canvas.shared.$sharedTextdocId",{"_9":10,"_11":12},"sharedTextdoc",{"_13":14,"_15":-7,"_16":17,"_18":19,"_20":21,"_22":23,"_24":12,"_25":12},"isAuthenticated",false,"sharedTextdocId","698e651676148191a41d318f2b5a07eb","versionInt","title","Diagrammes De Venn Db Interactifs (html/css/js)","type","code/html","content","\n\n\n \n \n Diagrammes de Venn interactifs: opérations DB\n \n\n\n

Venn + SQL: opérations de base en DB (version interactive)

\n Deux ensembles A et B (ici: Employés et Badges). Sélectionne une opération: le diagramme se met en évidence, et le résultat se matérialise en tableau.\n

Survole une zone pour voir les IDs

Clique une zone pour filtrer

Modifie les données: c'est le point

\n\n

\n \n

Diagramme

Les régions correspondent aux IDs: A\\B, B\\A, A∩B

\n \n

\n\n

\n \n

\n\n

\n A\\B (dans A seulement)\n A∩B (match)\n B\\A (dans B seulement)\n

\n\n

\n Interprétation DB: on considère ici que A et B partagent une clé (id). Les régions décrivent les clés qui existent dans une table, l'autre, ou les deux.\n C'est un modèle mental utile, même si un vrai JOIN combine des colonnes.\n

\n\n \n

Opération + résultat

Choisis une opération (ensembles ou joins) et regarde la magie bureaucratique opérer

\n\n

\n Opération\n \n

\n \n \n

\n\n

Table A: Employés

\n \n \n

\n\n

Table B: Badges

\n \n \n

\n\n

SQL (approximation pédagogique)

\n\n

Résultat

\n\n

Zone

…

\n\n \n\n\n","access","public","isModerationBlocked","isAnonifyApiKeyDetected","dd",{"_41":42,"_43":44},"disablePrefetch",true,"shouldPrefetchAccount","shouldPrefetchUser","shouldPrefetchSystemHints","manageRootRouteStylesheet","mobileWebHandoffEnabled","promoteCss","disableSSR","stripModulepreloadImports","paidCampaignAppRedirect","statsigGateEvaluationsPromise",["P",40],"traceId","14329007758217764424","traceTime",1788643638293]