{"id":9989,"date":"2025-09-18T08:28:30","date_gmt":"2025-09-18T06:28:30","guid":{"rendered":"https:\/\/spgoo.org\/?page_id=9989"},"modified":"2025-09-18T08:28:31","modified_gmt":"2025-09-18T06:28:31","slug":"two-edos","status":"publish","type":"page","link":"https:\/\/spgoo.org\/?page_id=9989","title":{"rendered":"Two EDOs"},"content":{"rendered":"  <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/jsxgraph@1.5.0\/distrib\/jsxgraphcore.js\"><\/script>\r\n  <link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/jsxgraph@1.5.0\/distrib\/jsxgraph.css\" \/>\r\n\r\n<script>\r\n    window.MathJax = {\r\n      tex: { inlineMath: [['$', '$'], ['\\\\(', '\\\\)']] },\r\n      svg: { fontCache: 'global' }\r\n};\r\n<\/script>\r\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/mathjax@3\/es5\/tex-mml-chtml.js\"><\/script>\r\n<link rel=\"stylesheet\" type=\"text\/css\" href=\"https:\/\/cdn.jsdelivr.net\/gh\/dreampulse\/computer-modern-web-font@master\/fonts.css\">\r\n  <style>\r\n    #jxgbox {\r\n      width: 600px;\r\n      height: 470px;\r\n      margin: 20px auto;\r\n      border: 1px solid #ccc;\r\n    }\r\n<\/style>\r\n  <div id=\"jxgbox\"><\/div>\r\n\r\n  <script>\r\n  JXG.Options.text.useMathJax = true;\t\r\n    const board = JXG.JSXGraph.initBoard(\"jxgbox\", {\r\n      boundingbox: [-6, 6, 6, -6],\r\n      axis: true,\r\n      grid: true,\r\n      showNavigation: false,\r\n      showCopyright: false\r\n    });\r\n    board.renderer.container.style.backgroundColor='#E8E8E8';\r\n    board.defaultAxes.x.setAttribute({\r\n      ticks: { drawLabels: true, majorHeight: 10, minorTicks: 5, minorHeight: 5, strokeColor: '#ccc' }\r\n    });\r\n    board.defaultAxes.y.setAttribute({\r\n      ticks: { drawLabels: true, majorHeight: 10, minorTicks: 5, minorHeight: 5, strokeColor: '#ccc' }\r\n    });\r\n\r\n    let allArrows = [], allCurves = [], E = null;\r\n    let textF, textG, textEquil;\r\n    \/\/ construction des lignes et du point d'equilibre \r\n    const dxPt1 = board.create(\"point\", [-3, 2], {name:\"\", size: 3,color:\"slategray\",face:\"[]\",higlight:false });\r\n    const dxPt2 = board.create(\"point\", [3, -1], {name:\"\", size: 3,color:\"slategray\",face:\"[]\",higlight:false });\r\n    const dyPt1 = board.create(\"point\", [-3, -2], {name:\"\", size: 3,color:\"slategray\",face:\"[]\",higlight:false  });\r\n    const dyPt2 = board.create(\"point\", [3, 2], {name:\"\", size: 3,color:\"slategray\",face:\"[]\",higlight:false  });\r\n\r\n    const line1=board.create(\"line\", [dxPt1, dxPt2], {highlight:false, strokeColor: \"#ff7f0e\", strokeWidth: 3 });\r\n    const line2=board.create(\"line\", [dyPt1, dyPt2], {highlight:false, strokeColor: \"#9467bd\", strokeWidth: 3 });\r\n    \r\n    \/\/ construction des points de depart \r\n    const pos = [[-4, 3], [-2, -2], [1, 4], [3, -3]];\r\n    pos.forEach((pos, i) => {\r\n      const pt = board.create(\"point\", pos, {name: '',size: 2,fillColor: \"#cc0000\",strokeColor: \"#cc0000\",fixed: false});\r\n\t    board.create(\"text\", [pos[0] + 0.3, pos[1] + 0.3, `\\\\(P_${i + 1}\\\\)`], {useHtml: true,cssStyle: \"font-size: 16px; color: #cc0000;\"});\r\n      \/\/ evenementiel pour le point \r\n      pt.on(\"down\", () => traceFromPoint(pt));\r\n    });\r\n\t\r\n\tMathJax.typesetPromise();\r\n\r\n  function getCoefficients(pt1, pt2) {\r\n      const x1 = pt1.X(), y1 = pt1.Y(), x2 = pt2.X(), y2 = pt2.Y();\r\n      const a = y2 - y1;\r\n      const b = x1 - x2;\r\n      const c = -(a * x1 + b * y1);\r\n      return { a, b, c };\r\n   }\r\n\r\n  function getSystem() {\r\n      const { a, b, c } = getCoefficients(dxPt1, dxPt2);\r\n      const { a: alpha, b: beta, c: gamma } = getCoefficients(dyPt1, dyPt2);\r\n      return { a, b, c, alpha, beta, gamma };\r\n  }\r\n\r\n  function getEquilibrium({ a, b, c, alpha, beta, gamma }) {\r\n      const det = a * beta - alpha * b;\r\n      if (Math.abs(det) < 1e-6) return null;\r\n      const x0 = (b * gamma - beta * c) \/ det;\r\n      const y0 = (c * alpha - a * gamma) \/ det;\r\n      return [x0, y0];\r\n  }\r\n\r\n  function traceFromPoint(pt) {\r\n      const { a, b, c, alpha, beta, gamma } = getSystem();\r\n      let x = pt.X(), y = pt.Y();\r\n      const dt = 0.03, steps = 200;\r\n      const path = [[x, y]];\r\n      for (let i = 0; i < steps; i++) {\r\n        const dx = a * x + b * y + c;\r\n        const dy = alpha * x + beta * y + gamma;\r\n        x += dx * dt;\r\n        y += dy * dt;\r\n        path.push([x, y]);\r\n      }\r\n      const curve = board.create(\"curve\", [path.map(p => p[0]), path.map(p => p[1])], {highlight:false, strokeColor: \"#E8E8E8\", strokeWidth: 2});\r\n      allCurves.push(curve);\r\n      let i = 0;\r\n      function drawArrowStep() {\r\n        if (i < path.length - 1) {\r\n          const arrow = board.create(\"arrow\", [path[i], path[i + 1]], {highlight:false,strokeColor: \"#2c7fb8\", strokeWidth: 1});\r\n          allArrows.push(arrow);\r\n          board.update();\r\n          i++;\r\n          setTimeout(drawArrowStep, 30);\r\n        }\r\n      }\r\n      drawArrowStep(); \r\n  }\r\n\r\n  textF = board.create(\"text\", [-5, -5, () => {\r\n      const { a, b, c } = getSystem();\r\n      return `\\\\( \\\\frac{dx}{dt} = ${(-a).toFixed(2)}x ${b < 0 ? `${b.toFixed(2)}y` : `+${b.toFixed(2)}x`} ${c < 0 ? `${c.toFixed(2)}` : `+${c.toFixed(2)}`} \\\\)`;\r\n  }], {\r\n      useHtml: true,\r\n      cssStyle: \"font-size: 18px; color: #ff7f0e;\"\r\n  });\r\n\r\n  textG = board.create(\"text\", [-5, -5.6, () => {\r\n      const { alpha, beta, gamma } = getSystem();\r\n      return `\\\\( \\\\frac{dy}{dt} = ${alpha.toFixed(2)}x ${beta < 0 ? `${beta.toFixed(2)}y` : `+${beta.toFixed(2)}x`} ${gamma < 0 ? `${gamma.toFixed(2)}` : `+${gamma.toFixed(2)}`} \\\\)`;\r\n  }], {\r\n    useHtml: true,\r\n    cssStyle: \"font-size: 18px; color: #9467bd;\"\r\n  });\r\n\r\n    textEquil = board.create(\"text\", [1, -5.3, \"\"], {\r\n      highlight:false,\r\n\t  useHtml: true,\r\n      cssStyle: \"font-size: 18px; color: #2c7fb8;\"\r\n    });\r\n    \r\n  const resetObj=function(){\r\n      allArrows.forEach(a => board.removeObject(a));\r\n      allCurves.forEach(c => board.removeObject(c));\r\n      allArrows = [];\r\n      allCurves = [];\r\n  }\r\n\r\n  function updateEquilibrium() {\r\n      const params = getSystem();\r\n      const eq = getEquilibrium(params);\r\n      if (!eq) {\r\n        textEquil.setText(`\\\\( x^E,\\\\ y^E = \\\\textrm{ind\u00e9termin\u00e9s} \\\\)`);\r\n        MathJax.typesetPromise();\r\n        return;\r\n      }\r\n      const [xE, yE] = eq;\r\n      if (!E) {\r\n        E = board.create(\"point\", eq, {\r\n          name: \"\\\\(E\\\\)\",\r\n          size: 5,\r\n          fillColor: \"#ff7f0e\",\r\n          strokeColor: \"#ff7f0e\",\r\n          label: { offset: [20, 0] },\r\n          showInfobox: false,\r\n\t\t      highlight:false\r\n        });\r\n      } else {\r\n        E.moveTo(eq, 0);\r\n      }\r\n      textEquil.setText(`\\\\( x^E = ${xE.toFixed(2)},\\\\quad y^E = ${yE.toFixed(2)} \\\\)`);\r\n      MathJax.typesetPromise();\r\n      resetObj();\r\n  }\r\n\r\n  dxPt1.on(\"move\", function() {updateEquilibrium();});\r\n  dxPt2.on(\"move\", function() {updateEquilibrium();});\r\n  dyPt1.on(\"move\", function() {updateEquilibrium();});\r\n  dyPt2.on(\"move\", function() {updateEquilibrium();});\r\n  \/\/ on trace la premi\u00e8re fois la position de l'equilibre \r\n  updateEquilibrium(); \r\n\r\n  const colors = [\"#ff7f0e\", \"#9467bd\"];\r\n  let colorIndex = 0;\r\n  \/*let Timer = setInterval(() => {\r\n      if (E) {\r\n        const col = colors[colorIndex % colors.length];\r\n        E.setAttribute({\r\n          fillColor: col,\r\n          strokeColor: col,\r\n          label: { strokeColor: col }\r\n        });\r\n        board.update();\r\n        colorIndex++;\r\n      }\r\n    }, 100);*\/\r\n\r\n    const resetBtn = board.create(\"text\", [-3, 5, \"\\\\(\\\\textrm{\ud83e\uddf9 R\u00e9initialiser}\\\\)\"], {\r\n      cssClass: \"jsx-button\",\r\n      anchorX: \"right\",\r\n      anchorY: \"bottom\",\r\n      useHtml: true\r\n    });\r\n\r\n\r\n    resetBtn.on(\"down\", () => {\r\n      allArrows.forEach(a => board.removeObject(a));\r\n      allCurves.forEach(c => board.removeObject(c));\r\n      allArrows = [];\r\n      allCurves = [];\r\n      board.update();\r\n      MathJax.typesetPromise();\r\n    });\r\n board.create('text',[1,5.75,'\\\\(\\\\textrm{Points verts : repositionnement des droites}\\\\)'],{color:'green',fixed:true,highlight:false,fontSize:8})\r\n board.create('text',[1,5.25,'\\\\(\\\\textrm{Cliquez sur les points rouge ou d\u00e9placez les et recliquez}\\\\)'],{color:'green',fixed:true,highlight:false,fontSize:8})\r\n  <\/script>\r\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-9989","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/9989","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/spgoo.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=9989"}],"version-history":[{"count":1,"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/9989\/revisions"}],"predecessor-version":[{"id":9990,"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/9989\/revisions\/9990"}],"wp:attachment":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=9989"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}