{"version":"https:\/\/jsonfeed.org\/version\/1","title":"mathspp.com feed","home_page_url":"https:\/\/mathspp.com\/blog\/tags\/pyscript","feed_url":"https:\/\/mathspp.com\/blog\/tags\/pyscript.json","description":"Stay up-to-date with the articles on mathematics and programming that get published to mathspp.com.","author":{"name":"Rodrigo Gir\u00e3o Serr\u00e3o"},"items":[{"title":"Floodfill algorithm in Python","date_published":"2025-11-17T16:49:00+01:00","id":"https:\/\/mathspp.com\/blog\/floodfill-algorithm-in-python","url":"https:\/\/mathspp.com\/blog\/floodfill-algorithm-in-python","content_html":"<p>Learn how to implement and use the floodfill algorithm in Python.<\/p>\n\n<link rel=\"stylesheet\" href=\"https:\/\/pyscript.net\/releases\/2025.11.1\/core.css\"><script defer type=\"module\" src=\"https:\/\/pyscript.net\/releases\/2025.11.1\/core.js\"><\/script><py-script>\nimport js\n\nroot = js.document.documentElement\ncomputed = js.window.getComputedStyle(root)\n\nBG_COLOUR = computed.getPropertyValue(\"--bg\").strip()\nFG_COLOUR = computed.getPropertyValue(\"--tx\").strip()\nUI_COLOUR = computed.getPropertyValue(\"--ui\").strip()\nAC_COLOUR = computed.getPropertyValue(\"--accent\").strip()\nAC2_COLOUR = computed.getPropertyValue(\"--accent-2\").strip()\nRE_COLOUR = computed.getPropertyValue(\"--re\").strip()\nBL_COLOUR = computed.getPropertyValue(\"--bl\").strip()\nGR_COLOUR = computed.getPropertyValue(\"--gr\").strip()\nYE_COLOUR = computed.getPropertyValue(\"--ye\").strip()\nOR_COLOUR = computed.getPropertyValue(\"--or\").strip()\n\nCONTRAST = {\n    BG_COLOUR: FG_COLOUR,\n    FG_COLOUR: BG_COLOUR,\n    UI_COLOUR: FG_COLOUR,\n    AC_COLOUR: FG_COLOUR,\n    AC2_COLOUR: FG_COLOUR,\n    RE_COLOUR: FG_COLOUR,\n    BL_COLOUR: FG_COLOUR,\n    GR_COLOUR: FG_COLOUR,\n    YE_COLOUR: FG_COLOUR,\n    OR_COLOUR: FG_COLOUR,\n}\n<\/py-script><p>In this article you will learn about the floodfill algorithm.\nYou will learn the intuitive explanation of the algorithm, how it can be used to colour regions in images, and how to implement it in Python.\nYou will also see three example applications of the floodfill algorithm, with interactive demos and code.<\/p>\n<p>By the time you are finished reading this article, you will be able to apply the floodfill algorithm in your own projects and modify it or tweak it according to your needs and preferences.<\/p>\n<h2 id=\"what-is-the-floodfill-algorithm\">What is the floodfill algorithm?<a href=\"#what-is-the-floodfill-algorithm\" class=\"toc-anchor after\" data-anchor-icon=\"#\" aria-label=\"Anchor\"><\/a><\/h2>\n<p>Click the image below to randomly colour the region you click.<\/p>\n<p>Go ahead, try it!<\/p>\n<canvas id=\"bitmap\" width=\"320\" height=\"320\" style=\"display: block; margin: 0 auto; max-width: 100%; height: auto;\"><\/canvas><script>\nfunction set_canvas_loading(canvas) {\n    let ctx = canvas.getContext(\"2d\");\n\n    \/\/ Get computed values of CSS variables\n    const styles = getComputedStyle(document.documentElement);\n    const bg = styles.getPropertyValue(\"--bg\").trim();\n    const fg = styles.getPropertyValue(\"--accent\").trim();\n\n    ctx.fillStyle = bg;\n    ctx.fillRect(0, 0, canvas.width, canvas.height);\n    ctx.fillStyle = fg;\n    ctx.font = \"36px Atkinson Hyperlegible\";\n    ctx.textAlign = \"center\";\n    ctx.textBaseline = \"middle\";\n    ctx.fillText(\"Loading...\", canvas.width \/ 2, canvas.height \/ 2);\n}\n\nset_canvas_loading(document.getElementById(\"bitmap\"));\n<\/script><py-script>\nIMG_WIDTH = 160\nIMG_HEIGHT = 160\nPIXEL_SIZE = 2\n\nimport asyncio\nimport collections\nimport itertools\n\nfrom pyscript import display\nfrom pyodide.ffi import create_proxy\nimport js\nfrom js import fetch\n\ncanvas = js.document.getElementById(\"bitmap\")\nctx = canvas.getContext(\"2d\")\n\n_BITMAP_COLOURS = itertools.cycle([AC_COLOUR, AC2_COLOUR, RE_COLOUR, BL_COLOUR, YE_COLOUR, GR_COLOUR, OR_COLOUR])\n\n_ints = [0, 0, 0, 0, 0, 0, 0, 9903520019135137019840167936, 316912650047833978337321025536, 5069364463233662545642129457152, 40406362882311561545666757918720, 159723975628759174402796798607360, 628754697713202062365541686837248, 1216944576219100292990829487718400, 2433889152438200467762168756961280, 4543259751217974183408433589387264, 9086519502435948354150493226795008, 18173039004871896701827061989244928, 15586952552243794457451031487840256, 36366340612306816504545604379082752, 31189423920820070440268979792510976, 31224838909463946599208478310400000, 31214663042341020773348807509278720, 31295792680755627454903859026067456, 31295772873714998888819460640079872, 31295772873714998888819460640079872, 31214663042341020773208070020923392, 31214658090580863631686970424426496, 31224838909463946599067740822044672, 31191949318500212615924220889661440, 31174023946731360309543681570897920, 31158772525447364424556924360458240, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 41538374867674158118542209162674176, 41538374867674158118542209162674176, 41538374867674158118542209162674176, 1813388729527496878325760, 1813388729531894857728000, 5444517870735014810951084025942904930304, 87112285931760246042160989809567281971200, 347088014259357233337105009500967893204992, 1372018503425223884684326417278139134115840, 2613368577952807399398716985189229563609088, 5226737155905614798797433970265209426542592, 9756576024357147624421876744396907856986112, 19513152048714295248843753488680566015623168, 39026304097428590497687506977247882333241344, 78052608194857180995375013954382514968641536, 78052608194857180995375013954382514968649728, 156105216389714361990750027908651780239548416, 133804471191183738849214309636003418733572096, 312210432779428723981500055817190310781399040, 267608942382367477698428619271893587769440256, 624420865558857447963000111634267371865126912, 535217884764734955396857238543673925841197056, 535217884764734955396857238543673925841198080, 1248841731117714895926000223268421494032571392, 1070435769529469910793714477087375339473079296, 1070435769529469910793714477087375339473079296, 1070435769529469910793714477087339055589363200, 2497683462235429791852000446537115666948820480, 2497683462235429791852000446537045298204642816, 2140871539058939821587428954175243260155397632, 2140871539058939821587428954176226223550629376, 2140871539058939821587428954176243815736673792, 2140871539058939821587428954182717740201018880, 2140871539058939821587428954191192775827916288, 4995366924470859583704000893143091548121990912, 4995366924470859583704000893352579299538896640, 4995366924470859583704000897667150887862142720, 4995366924470900148523208196270458264975574784, 4995366924471184102257659318649205691078674176, 4995366924472147516713832774153879352074307328, 4995366924475889621285706507409303589789632256, 4995366924480596407964353923103877354846422784, 4995366924489042763913674615590287289608046336, 4995366924507286632895834264625967053561399040, 4995366924543708928397916780318445517146162944, 4995366924533795900704132026398741298080122624, 2140871539205541078202623227998533436869445120, 2140871539185988835344703017709848286629725696, 2140871539354576223970255702273697839319090688, 2140871539312713330548318654518670712664753664, 2140871539649563589245765596919586662022907392, 2140871539648265515031131890012454037940604416, 2497683462752063329276215795575400873427209728, 2497683462749467180846948381761135625262599168, 1070435770708121297681120348763544019020024832, 1070435770728890485115259659277666004336905216, 1248841732317135470247545405458852896384752640, 1248841732311943173389010577830322400055531520, 535217885958963232859867593105574831864158208, 535217885958963232859867593105574831864166400, 624420866753085725426010466196168277888086016, 267608943576595755161438973833794493792415744, 312210433973657001444510410379091216804372480, 133804472385412016312224664197904324756561920, 156105217583942639453760382470552686262534144, 66902236789820146887617509379959240238678016, 78052609389085458458385368516283420991782912, 39026305291656867960697861539148788356546560, 19513153242942572711854108050581472039272448, 20906949817850736658200090442621994634313728, 10453475506039507060605222502318075184414720, 5226738350133892261807788532166115481092096, 1306685483204681162709713054552146185289728, 691454963811624423185783403544767058935808, 174224436863802173805581096441418979737600, 21777936483221741569526362504672367869952, 31153781153022354500604921737379840, 31153781153626817410377051952644096, 31153781153626817410377051952644096, 31153781153626817410377051952644096, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208965771288531091587072, 31153781151208974706430191794651136, 31153781151209002592719084472762368, 31153781151209035487010762786865152, 31153781151209095024597836624822272, 31153781151209076577853762915270656, 31153781151209224079748758553755648, 31153781151209187195267810389393408, 31153781151209187195267810389393408, 31153781151209224088755957808496640, 36346078009744051708279254882975744, 36346078009743922653128332954042368, 15576890575604621488479174058311680, 18173039004871970415021728557170688, 9086519502435985099512434151915520, 9086519502435951809185463605919744, 4543259751217974175949346706554880, 2433889152438200452843994991296512, 1216944576219100229377484751110144, 628754697713201800030863392505856, 157188674428300515591385421709312, 39930993907189793600699199651840, 10061976639316146531601490116608, 2534063261007325117889137082368, 158456325026222832177874206720, 4951760083354544804758290432, 0, 0, 0, 0, 0, 0, 0, 0, 0]\n\ndef parse_bitmap():\n    return [[1] * 160] + [\n        [1] + [int(c) for c in bin(i).removeprefix(\"0b\").zfill(158)] + [1]\n        for i in _ints\n    ] + [[1] * 160]\n\n'''\nasync def load_bitmap(url: str) -&gt; list[list[int]]:\n    # Fetch the text file from the URL\n    response = await fetch(url)\n    text = await response.text()\n\n    bitmap: list[list[int]] = []\n    for line in text.splitlines():\n        line = line.strip()\n        if...<\/py-script>","summary":"Learn how to implement and use the floodfill algorithm in Python.","date_modified":"2025-11-23T15:59:09+01:00","tags":["python","programming","algorithms","pyscript","visualisation","graphs"],"image":"\/user\/pages\/02.blog\/floodfill-algorithm-in-python\/thumbnail.webp"}]}