{"id":12151,"date":"2026-05-07T10:35:14","date_gmt":"2026-05-07T08:35:14","guid":{"rendered":"https:\/\/spgoo.org\/?page_id=12151"},"modified":"2026-05-11T11:21:48","modified_gmt":"2026-05-11T09:21:48","slug":"fonctions-dutilite","status":"publish","type":"page","link":"https:\/\/spgoo.org\/?page_id=12151","title":{"rendered":"Fonctions d&#8217;utilit\u00e9"},"content":{"rendered":"\n<link rel='stylesheet' id='12201-css'  href='https:\/\/spgoo.org\/wp-content\/uploads\/winp-css-js\/12201.css?ver=1778572199' type='text\/css' media='all' \/>\n\n\n<script type='text\/javascript'>\nvar id = \"12231\";<\/script>\n<script type='text\/javascript' src='https:\/\/spgoo.org\/wp-content\/uploads\/winp-css-js\/12231.js?ver=1778834776'><\/script>\n\n\n  \r\n<title>Utilit\u00e9 \u2013 Liste d\u00e9roulante JSXGraph<\/title>\r\n  <style>\r\n\t  .fen_arrondie {\r\n\t\t  border-radius: 10px;\r\n\t  }\r\n\t  .fen_mi_arrondie_haut {\r\n\t\t  border-top-left-radius : 10px;\r\n\t\t  border-top-right-radius : 10px;\r\n\t  }\r\n    \/*body {\r\n      background-color: #f8f8f8;\r\n      color: #074978;\r\n      font-family:  \"CMU Serif\", \"Times New Roman\", serif;\r\n      margin: 20px;\r\n    }*\/\r\n    .jxgbox {\r\n      border: 2px solid #ccc;\r\n      box-shadow: 0 4px 8px rgba(0,0,0,0.1);\r\n\t  border-radius : 8px\r\n    }\r\n    .control-panel {\r\n      padding: 8px;\r\n      background: rgba(255,255,255,0.9);\r\n      border-radius: 4px;\r\n      font-size: 14px;\r\n\t   font-family: \"CMU Serif\", \"Times New Roman\", serif;\r\n    }\r\n\t#bloc_formules {\r\n  \t\ttext-align: left;\r\n\t}\r\n.grp {\r\n  color: #1F6357;\r\n  font-weight: bold;\r\n}\r\n\r\n.coef-inexistant {\r\n  color: #C11B17;\r\n  font-weight: bold;\r\n}\r\n\r\n\/* Tout le select : fond blanc par d\u00e9faut *\/\r\n#uf_select {\r\n  background-color: #ffffff;\r\n}\r\n\r\n\/* Police de la bo\u00eete et des options (Computer Modern \/ CMU Serif) *\/\r\n#uf_select,\r\n#uf_select option,\r\n#uf_select optgroup {\r\n  font-family: \"CMU Serif\", \"Computer Modern\", serif;\r\n}\r\n\r\n\/* Titres de groupe (non s\u00e9lectionnables) : fond gris, texte rouge fonc\u00e9 *\/\r\n#uf_select optgroup {\r\n  background-color: #e0e0e0;\r\n  color: #DC143C;\r\n  font-weight: bold;\r\n  font-family: \"CMU Serif\", \"Computer Modern\", serif;\r\n}\r\n\r\n\/* Options s\u00e9lectionnables : fond blanc *\/\r\n#uf_select option {\r\n  background-color: #ffffff;\r\n  color: #074978;\r\n  font-weight: normal; \/* ou bold si tu veux, mais distinct des optgroup *\/\r\n}\r\n\r\n\/* Tous les textes\/labels JSXGraph, y compris sliders, en Computer Modern *\/\r\ndiv.cmuText {\r\n  font-family: \"CMU Serif\", \"Computer Modern\", serif;\r\n}\r\n  \r\n  #mydivFenVar\r\n  {\r\n    position: fixed;\r\n    top: 150px;\r\n    right: 200px;\r\n      height:500px;\r\n    z-index: 9;\r\n    background-color:  rgb(167, 195, 212); \r\n    text-align:left;\r\n    z-index:1000;\r\n    border: 1px solid #d3d3d3;    \r\n    -webkit-box-shadow: 8px 9px 15px -4px rgba(13,58,64,0.88); \r\n    box-shadow: 8px 9px 15px -4px rgba(13,58,64,0.88);\r\n\r\n  }\r\n  #mydivFenVarheader {\r\n    padding: 10px;\r\n    cursor: move;\r\n    z-index: 10;\r\n    font-size:16px; \r\n    background-color: rgb(167, 195, 212); \r\n    color: #fff;\r\n  }\r\n<\/style>\r\n\r\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/jsxgraph\/distrib\/jsxgraphcore.js\"><\/script>\r\n<link rel=\"stylesheet' href='https:\/\/cdn.jsdelivr.net\/npm\/jsxgraph\/distrib\/jsxgraph.css\" \/>\r\n\r\n  <script>\r\n    window.MathJax = {\r\n      tex: {\r\n        inlineMath: [ ['$','$'], [\"\\\\(\",\"\\\\)\"] ],\r\n        displayMath: [ ['$$','$$'], [\"\\\\[\",\"\\\\]\"] ],\r\n        packages: ['base', 'ams']\r\n      }\r\n    };\r\n  <\/script>\r\n  <script type=\"text\/x-mathjax-config\">\r\n  MathJax.Hub.Config({\r\n    TeX: {\r\n      extensions: [\"color.js\"]\r\n    }\r\n  });\r\n<\/script>\r\n\r\n  <script type=\"text\/javascript\" id=\"MathJax-script\"\r\n          src=\"https:\/\/cdn.jsdelivr.net\/npm\/mathjax@3\/es5\/tex-mml-chtml.js\">\r\n  <\/script>\r\n\r\n\r\n  <!-- Fen\u00eatres modales d'affichage d'info compl\u00e9mentaires -->\r\n  <!-- -->\r\n  <!-- Fenetre de s\u00e9lection des colonnes dans l'importation de donn\u00e9es de type CSV -->\r\n  <!-- -->\r\n   <!-- Identit\u00e9 Variable -->\r\n    <div id=\"mydivFenVar\" class=\"fen_arrondie\" style=\"height:650px;width:700px;margin-bottom:10px;display:none\" >\r\n      <div id=\"mydivFenVarheader\"  class=\"fen_mi_arrondie_haut\" style=\"display:flex;justify-content:space-between;height:60px;\">\r\n        <h4 style=\"color:black;font-size:22px;;margin:10px 10px 10px 15px;\">\\(\\textrm{Fen\u00eatre de code javascript}\\)<\/h4>        \r\n        <button class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\" onclick=\"closeModal('mydivFenVar');\"><\/button>\r\n      <\/div>\r\n\t  <div id=\"mydivFenVarBody\" style=\"margin:30px;width:90%; height:80%;border-radius:10px;overflow:auto\">\r\n\t\t  <p style=\"color:blue;text-align:center;\" >Instructions \u00e9quivalentes en javascript pour tracer le m\u00eame graphique <\/p>\r\n\t\t  <pre id=\"codeInstruction\"> <\/pre>\r\n\t  <\/div>\r\n    <\/div>\r\n\r\n<center>\r\n  <div id=\"box1\" class=\"jxgbox\" style=\"width:900px; height:300px;\"><\/div>\r\n <div class=\"pf-ctrl\">\r\n\r\n    <div class=\"pf-axis-group\">\r\n      <div class=\"pf-axis-lbl\">Rotation autour de X<\/div>\r\n      <div class=\"pf-btns\">\r\n        <button class=\"pf-btn\" id=\"pf-xp\">\r\n          <div class=\"pf-arrow\"><div class=\"pf-arc ax-ym\"><\/div><\/div>\r\n          <span class=\"pf-btn-lbl\">X +<\/span>\r\n        <\/button>\r\n        <button class=\"pf-btn\" id=\"pf-xm\">\r\n          <div class=\"pf-arrow\"><div class=\"pf-arc ax-yp\"><\/div><\/div>\r\n          <span class=\"pf-btn-lbl\">X \u2212<\/span>\r\n        <\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"pf-sep\"><\/div>\r\n\r\n    <div class=\"pf-axis-group\">\r\n      <div class=\"pf-axis-lbl\">Rotation autour de Y<\/div>\r\n      <div class=\"pf-btns\">\r\n        <button class=\"pf-btn\" id=\"pf-ym\">\r\n          <div class=\"pf-arrow\"><div class=\"pf-arc ax-xp\"><\/div><\/div>\r\n          <span class=\"pf-btn-lbl\">Y \u2212<\/span>\r\n        <\/button>\r\n        <button class=\"pf-btn\" id=\"pf-yp\">\r\n          <div class=\"pf-arrow\"><div class=\"pf-arc ax-xm\"><\/div><\/div>\r\n          <span class=\"pf-btn-lbl\">Y +<\/span>\r\n        <\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"pf-sep\"><\/div>\r\n\r\n    <div class=\"pf-info\">\r\n      <div class=\"pf-face-num\" id=\"pf-num\">1<\/div>\r\n      <div class=\"pf-face-name\" id=\"pf-name\">KPI<\/div>\r\n      <div class=\"pf-dots\">\r\n        <div class=\"pf-dot on\"><\/div>\r\n        <div class=\"pf-dot\"><\/div>\r\n        <div class=\"pf-dot\"><\/div>\r\n        <div class=\"pf-dot\"><\/div>\r\n        <div class=\"pf-dot\"><\/div>\r\n        <div class=\"pf-dot\"><\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"pf-sep\"><\/div>\r\n\r\n    <div class=\"pf-speed\">\r\n      <div class=\"pf-axis-lbl\">Vitesse de rotation <\/div>\r\n      <input type=\"range\" id=\"pf-spd\" min=\"150\" max=\"900\" step=\"50\" value=\"450\">\r\n      <div class=\"pf-speed-lbl\" id=\"pf-spd-lbl\">0.45 s<\/div>\r\n    <\/div>\r\n\r\n  <\/div>\t\r\n  <!-- \u2550\u2550 SC\u00c8NE \u2550\u2550 -->\r\n  <div class=\"pf-scene\">\r\n    <div class=\"pf-stage\">\r\n\t\t<div id=\"pf-panel\">\r\n\t\t\t<div id=\"box2\" class=\"jxgbox\" style=\"width:900px; height:480px; margin-top:10px;\"><\/div>\r\n\t\t<\/div>\r\n    <\/div>\r\n  <\/div>\t\r\n\t\r\n  <\/center>\r\n\r\n<script>\r\n\r\nconst closeModal=function(fen) {\r\n\tdocument.getElementById(fen).style.display=\"none\";\r\n}\r\n\r\n<\/script>\r\n\t\t \r\n\r\n\r\n\n\n<script type='text\/javascript'>\nvar id = \"12215\";<\/script>\n<script type='text\/javascript' src='https:\/\/spgoo.org\/wp-content\/uploads\/winp-css-js\/12215.js?ver=1778574272'><\/script>\n\n\n<script type='text\/javascript'>\nvar id = \"12235\";<\/script>\n<script type='text\/javascript' src='https:\/\/spgoo.org\/wp-content\/uploads\/winp-css-js\/12235.js?ver=1778828909'><\/script>\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-12151","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/12151","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=12151"}],"version-history":[{"count":6,"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/12151\/revisions"}],"predecessor-version":[{"id":12237,"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/12151\/revisions\/12237"}],"wp:attachment":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12151"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}