{"id":16231589,"url":"https://github.com/hustcc/streamlit-g2","last_synced_at":"2025-03-19T14:30:41.929Z","repository":{"id":212022660,"uuid":"730516708","full_name":"hustcc/streamlit-g2","owner":"hustcc","description":"☘️ A visualization grammar based on G2 for streamlit.","archived":false,"fork":false,"pushed_at":"2024-01-10T15:20:15.000Z","size":37,"stargazers_count":21,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-17T07:51:28.851Z","etag":null,"topics":["antv","g2","streamlit-component"],"latest_commit_sha":null,"homepage":"https://antv-g2.streamlit.app/","language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hustcc.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-12-12T05:10:14.000Z","updated_at":"2024-11-30T10:09:14.000Z","dependencies_parsed_at":"2023-12-12T06:24:47.542Z","dependency_job_id":"d8471f53-b557-4200-b1b4-02b3b1a34f85","html_url":"https://github.com/hustcc/streamlit-g2","commit_stats":{"total_commits":16,"total_committers":1,"mean_commits":16.0,"dds":0.0,"last_synced_commit":"8388386af0743e02f64bbc8626768a987f7382da"},"previous_names":["hustcc/streamlit-g2"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustcc%2Fstreamlit-g2","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustcc%2Fstreamlit-g2/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustcc%2Fstreamlit-g2/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustcc%2Fstreamlit-g2/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hustcc","download_url":"https://codeload.github.com/hustcc/streamlit-g2/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244444443,"owners_count":20453726,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["antv","g2","streamlit-component"],"created_at":"2024-10-10T13:06:11.795Z","updated_at":"2025-03-19T14:30:41.629Z","avatar_url":"https://github.com/hustcc.png","language":"Python","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003e\n  \u003cb\u003eStreamlit G2\u003c/b\u003e\n\u003c/h1\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n[G2](https://github.com/antvis/G2) is a visualization grammar for dashboard building, data exploration and storytelling.\n\nThis project was created to allow us to render [G2](https://github.com/antvis/G2) charts in streamlit. [Live Demo](https://antv-g2.streamlit.app/).\n\n![examples](https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*_GfqQoRCqQkAAAAAAAAAAAAADmJ7AQ/fmt.webp)\n\n[![PyPI version](https://badge.fury.io/py/streamlit-g2.svg)](https://badge.fury.io/py/streamlit-g2)\n[![Build Status](https://github.com/antvis/g2/workflows/build/badge.svg?branch=v5)](https://github.com/antvis//actions)\n[![Coverage Status](https://img.shields.io/coveralls/github/antvis/g2/v5.svg)](https://coveralls.io/github/antvis/g2?branch=v5)\n[![npm Version](https://img.shields.io/npm/v/@antv/g2.svg)](https://www.npmjs.com/package/@antv/g2)\n[![npm Download](https://img.shields.io/npm/dm/@antv/g2.svg)](https://www.npmjs.com/package/@antv/g2)\n[![npm License](https://img.shields.io/npm/l/@antv/g2.svg)](https://www.npmjs.com/package/@antv/g2)\n\n\u003c/div\u003e\n\n\n## Installation\n\n```\npip install streamlit-g2 \n```\n\n\n## Usage\n\n```py\nimport streamlit as st\nfrom streamlit_g2 import g2\n\noptions = {\n    \"type\": \"interval\",\n    \"data\": [\n        { \"genre\": 'Sports', \"sold\": 275 },\n        { \"genre\": 'Strategy', \"sold\": 115 },\n        { \"genre\": 'Action', \"sold\": 120 },\n        { \"genre\": 'Shooter', \"sold\": 350 },\n        { \"genre\": 'Other', \"sold\": 150 },\n    ],\n    \"encode\": {\n        \"x\": \"genre\",\n        \"y\": \"sold\",\n        \"color\": \"genre\",\n    }\n}\n\ng2(options=options, style=None)\n```\n\n\u003cimg src=\"https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*XqCnTbkpAkQAAAAAAAAAAAAADmJ7AQ/fmt.webp\" width=\"640\" alt=\"example\"\u003e\n\n\n## API\n\nNow, There is only one API for `streamlit-g2`, named `g2`, see the `options` in [G2 Spec API](https://g2.antv.antgroup.com/manual/core/api).\n\n| Property | Description                                                                                                     | Type                  | Default |\n| -------- | --------------------------------------------------------------------------------------------------------------- | --------------------- | ------- |\n| options  | the [options](https://g2.antv.antgroup.com/manual/core/api) for the visualization, say `chart.options(options)` | `G2options` \\| `null` | -       |\n| style    | the style of the container                                                                                      | `CSSProperties`       | -       |\n\n## FAQ\n\n- How to use Javascript callback function?\n\n```py\nimport streamlit as st\nfrom streamlit_g2 import g2, JS\n\noptions = {\n    \"type\": \"interval\",\n    \"data\": [\n        { \"genre\": 'Sports', \"sold\": 275 },\n        { \"genre\": 'Strategy', \"sold\": 115 },\n        { \"genre\": 'Action', \"sold\": 120 },\n        { \"genre\": 'Shooter', \"sold\": 350 },\n        { \"genre\": 'Other', \"sold\": 150 },\n    ],\n    \"encode\": {\n        \"x\": \"genre\",\n        \"y\": \"sold\",\n        # Use Javascript function.\n        \"color\": JS('''(d) =\u003e d.sold \u003e 300 ? \"red\" : \"green\"'''),\n    }\n}\n\ng2(options=option)\n```\n\n\n## Development\n\n- Building frontend code by running `npm run start` in fold `streamlit_g2/frontend`.\n- Run the example by running `streamlit run streamlit_g2/__init__.py` with `_RELEASE = False`.\n\n\n## License\n\nMIT@[hustcc](https://github.com/hustcc).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhustcc%2Fstreamlit-g2","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhustcc%2Fstreamlit-g2","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhustcc%2Fstreamlit-g2/lists"}