{
    "id": 190,
    "date": "2026-02-26T11:02:31",
    "date_gmt": "2026-02-26T11:02:31",
    "guid": {
        "rendered": "https:\/\/sistemestradingtdr.cat\/?page_id=190"
    },
    "modified": "2026-03-03T08:24:42",
    "modified_gmt": "2026-03-03T08:24:42",
    "slug": "programacio-amb-la-llibreria-dash",
    "status": "publish",
    "type": "page",
    "link": "http:\/\/sistemestradingtdr.cat\/en\/programacio-amb-la-llibreria-dash\/",
    "title": {
        "rendered": "Programaci\u00f3 amb la llibreria dash"
    },
    "content": {
        "rendered": "<p class=\"wp-block-paragraph\">La visualitzaci\u00f3 de les estrat\u00e8gies es fa amb la llibreria dash de Python. A continuaci\u00f3 explicar\u00e9 una mica el seu funcionament. L\u2019estructura \u00e9s la seg\u00fcent:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"472\" src=\"https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-11-1024x472.png\" alt=\"\" class=\"wp-image-244\" srcset=\"https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-11-1024x472.png 1024w, https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-11-300x138.png 300w, https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-11-768x354.png 768w, https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-11.png 1076w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Tot est\u00e0 en un contenidor amb una \u00fanica columna. Dins d\u2019aquesta columna posem el t\u00edtol i les diferents pestanyes (<em>tabs<\/em>). El contingut de cada pestanya est\u00e0 distribu\u00eft en files i columnes. Per exemple, la pestanya \u201cGr\u00e0fiques en temps real\u201d que s\u2019observa a la Figura 22 est\u00e0 composada per dues files, i a la vegada cada fila cont\u00e9 dues columnes. M\u00e9s precisament:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>La primera fila i primera columna cont\u00e9 el selector de s\u00edmbol.<\/li>\n\n\n\n<li>La primera fila i segona columna cont\u00e9 el selector de finestra temporal.<\/li>\n\n\n\n<li>La segona fila i primera columna cont\u00e9 la taula amb el bid\/ask de les majors.<\/li>\n\n\n\n<li>La segona fila i segona columna cont\u00e9 la gr\u00e0fica del parell i finestra temporal seleccionats.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">L\u2019estructura del codi d\u2019aquesta pestanya t\u00e9 aquesta forma:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"532\" src=\"https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-10-1024x532.png\" alt=\"\" class=\"wp-image-243\" srcset=\"https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-10-1024x532.png 1024w, https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-10-300x156.png 300w, https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-10-768x399.png 768w, https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-10.png 1166w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Els selectors els creem amb:<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td>dcc.Dropdown(<br>&nbsp; &nbsp; id=&#8217;selector-symbol&#8217;,<br>&nbsp; &nbsp; options=[{&#8216;label&#8217;:name, &#8216;value&#8217;:name} <strong>for<\/strong> name <strong>in<\/strong> symbols_all],<br>&nbsp; &nbsp; value=&#8217;EURUSD&#8217;<br>)Cada component t\u00e9 un identificador, en aquest cas \u201cselector-symbol\u201d aix\u00f2 permet despr\u00e9s fer <em>callbacks <\/em>per actualitzar la informaci\u00f3 si el valors d\u2019aquests selectors canvien.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Per exemple:<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><strong>@app.callback(<\/strong><br>&nbsp; &nbsp; [<br>&nbsp; &nbsp; &nbsp; &nbsp; Output(&#8216;table-bid-ask&#8217;, &#8216;data&#8217;),<br>&nbsp; &nbsp; &nbsp; &nbsp; Output(&#8216;table-bid-ask&#8217;, &#8216;columns&#8217;),<br>&nbsp; &nbsp; &nbsp; &nbsp; Output(&#8216;time&#8217;, &#8216;children&#8217;)<br>&nbsp; &nbsp; ],<br>&nbsp; &nbsp; [Input(&#8216;interval-component-table-bid-ask&#8217;, &#8216;n_intervals&#8217;)]<br>)<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Aqu\u00ed, donat el component \u201cinterval-component-table-bid-ask\u201d que \u00e9s per actualitzar el rellotge i la taula de la primera pestanya cada segon, es defineix una funci\u00f3 que retorna l\u2019hora actual i crea la taula amb les dades de les major a temps real connectant-se a MT5.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"737\" height=\"449\" src=\"https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-12.png\" alt=\"\" class=\"wp-image-245\" srcset=\"https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-12.png 737w, https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-12-300x183.png 300w, https:\/\/sistemestradingtdr.cat\/wp-content\/uploads\/2026\/03\/image-12-240x145.png 240w\" sizes=\"auto, (max-width: 737px) 100vw, 737px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Figura 23.Taula de divises principals en temps real (<em>dashboard<\/em>).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Aquest \u00e9s el funcionament general d\u2019aquesta llibreria: es creen components (selectors, taules, gr\u00e0fiques, etc.) i es fan callbacks per actualitzar la informaci\u00f3 en cas de ser necessari.&nbsp;<\/p>",
        "protected": false
    },
    "excerpt": {
        "rendered": "<p>La visualitzaci\u00f3 de les estrat\u00e8gies es fa amb la llibreria dash de Python. A continuaci\u00f3 explicar\u00e9 una mica el seu funcionament. L\u2019estructura \u00e9s la seg\u00fcent: Tot est\u00e0 en un contenidor amb una \u00fanica columna. Dins d\u2019aquesta columna posem el t\u00edtol i les diferents pestanyes (tabs). El contingut de cada pestanya est\u00e0 distribu\u00eft en files i [&hellip;]<\/p>",
        "protected": false
    },
    "author": 1,
    "featured_media": 0,
    "parent": 0,
    "menu_order": 0,
    "comment_status": "closed",
    "ping_status": "closed",
    "template": "",
    "meta": {
        "_monsterinsights_skip_tracking": false,
        "_monsterinsights_sitenote_active": false,
        "_monsterinsights_sitenote_note": "",
        "_monsterinsights_sitenote_category": 0,
        "footnotes": ""
    },
    "class_list": [
        "post-190",
        "page",
        "type-page",
        "status-publish",
        "hentry"
    ],
    "aioseo_notices": [],
    "_links": {
        "self": [
            {
                "href": "https:\/\/sistemestradingtdr.cat\/en\/wp-json\/wp\/v2\/pages\/190",
                "targetHints": {
                    "allow": [
                        "GET"
                    ]
                }
            }
        ],
        "collection": [
            {
                "href": "https:\/\/sistemestradingtdr.cat\/en\/wp-json\/wp\/v2\/pages"
            }
        ],
        "about": [
            {
                "href": "https:\/\/sistemestradingtdr.cat\/en\/wp-json\/wp\/v2\/types\/page"
            }
        ],
        "author": [
            {
                "embeddable": true,
                "href": "https:\/\/sistemestradingtdr.cat\/en\/wp-json\/wp\/v2\/users\/1"
            }
        ],
        "replies": [
            {
                "embeddable": true,
                "href": "https:\/\/sistemestradingtdr.cat\/en\/wp-json\/wp\/v2\/comments?post=190"
            }
        ],
        "version-history": [
            {
                "count": 2,
                "href": "https:\/\/sistemestradingtdr.cat\/en\/wp-json\/wp\/v2\/pages\/190\/revisions"
            }
        ],
        "predecessor-version": [
            {
                "id": 246,
                "href": "https:\/\/sistemestradingtdr.cat\/en\/wp-json\/wp\/v2\/pages\/190\/revisions\/246"
            }
        ],
        "wp:attachment": [
            {
                "href": "https:\/\/sistemestradingtdr.cat\/en\/wp-json\/wp\/v2\/media?parent=190"
            }
        ],
        "curies": [
            {
                "name": "wp",
                "href": "https:\/\/api.w.org\/{rel}",
                "templated": true
            }
        ]
    }
}