{"id":1954,"library":"branca","title":"Branca: HTML+JS Generation","description":"Branca is a Python library designed to generate complex HTML and JavaScript pages from Python objects. It serves as a low-level base for other visualization libraries, most notably Folium, providing core components like `Figure`, `Element`, and `Colormap`. The current version is 0.8.2, and it maintains an active development cycle with regular patch and minor releases.","status":"active","version":"0.8.2","language":"en","source_language":"en","source_url":"https://github.com/python-visualization/branca","tags":["html generation","visualization","jupyter","maps","templating"],"install":[{"cmd":"pip install branca","lang":"bash","label":"Install stable version"}],"dependencies":[{"reason":"Used for templating HTML and JavaScript content.","package":"Jinja2","optional":false}],"imports":[{"symbol":"Figure","correct":"from branca.element import Figure"},{"symbol":"Element","correct":"from branca.element import Element"},{"symbol":"JavascriptLink","correct":"from branca.element import JavascriptLink"},{"symbol":"LinearColormap","correct":"from branca.colormap import LinearColormap"},{"symbol":"StepColormap","correct":"from branca.colormap import StepColormap"}],"quickstart":{"code":"from branca.element import Figure, Element, JavascriptLink\n\n# Create a new Figure object to hold elements\nf = Figure(width=\"100%\", height=\"400px\")\n\n# Add a JavaScript library link (e.g., jQuery) to the figure's head\nf.add_child(JavascriptLink(\"https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js\"))\n\n# Add a simple HTML element to the figure's body\nf.add_child(Element(\"<h1>Hello from Branca!</h1><p>This is a basic HTML element generated by Python.</p>\"))\n\n# Render the figure to an HTML string\nhtml_output = f.render()\nprint(html_output[:500]) # Print the first 500 characters of the generated HTML\n\n# To save to a file (uncomment to run):\n# f.save(\"branca_example.html\")","lang":"python","description":"This quickstart demonstrates how to create a `Figure` object, add external JavaScript links and custom HTML `Element`s to it, and then render the entire structure to an HTML string or save it to a file. It showcases Branca's role as a low-level HTML/JS generation utility."},"warnings":[{"fix":"Upgrade your Python interpreter to 3.8 or newer.","message":"Python 3.7 support was dropped in Branca v0.7.2. Users on Python 3.7 or older must upgrade their Python environment or stick to Branca <0.7.2.","severity":"breaking","affected_versions":">=0.7.2"},{"fix":"Avoid direct access to `Element._env`. Use public methods or properties for element manipulation. If highly custom Jinja2 templating is needed, it might require a different approach or contributing to Branca's public API.","message":"The internal `_env` instance attribute was removed from the `Element` class in v0.7.1. Direct access or manipulation of this attribute will cause `AttributeError`.","severity":"breaking","affected_versions":">=0.7.1"},{"fix":"Update any custom code that extracts HTML content from Branca elements to look for the `srcdoc` attribute instead of `data-html`.","message":"In v0.5.0, `Element` changed how it stores HTML content, moving from `data-html` to `srcdoc`. If you have custom parsers or scripts that relied on the `data-html` attribute to extract content, they will break.","severity":"breaking","affected_versions":">=0.5.0"},{"fix":"Review your codebase for any direct calls to `branca.utilities.split_six` and remove or replace them with equivalent standard Python functionality.","message":"The `split_six` utility function was removed in v0.7.2. While primarily an internal utility, if any custom code used it, it will no longer be available.","severity":"deprecated","affected_versions":">=0.7.2"},{"fix":"If your application relies on predicting element IDs for JavaScript, consider using the new customization options to explicitly define IDs or ensure your JS is resilient to varying ID formats.","message":"Starting with v0.8.2, `Element` ID generation became customizable. While this offers flexibility, if you relied on the exact default ID generation pattern for JavaScript interactions in previous versions, you might encounter subtle changes or unexpected behavior if IDs change slightly.","severity":"gotcha","affected_versions":">=0.8.2"}],"env_vars":null,"last_verified":"2026-04-09T00:00:00.000Z","next_check":"2026-07-08T00:00:00.000Z"}