https://github.com/lzxue/streamlit-l7
l7 for streamlit-l7
https://github.com/lzxue/streamlit-l7
gis map streamlit-components visualization
Last synced: 2 months ago
JSON representation
l7 for streamlit-l7
- Host: GitHub
- URL: https://github.com/lzxue/streamlit-l7
- Owner: lzxue
- License: mit
- Created: 2023-12-19T14:45:37.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-12-26T05:16:17.000Z (over 2 years ago)
- Last Synced: 2026-03-12T17:45:19.627Z (4 months ago)
- Topics: gis, map, streamlit-components, visualization
- Language: Python
- Homepage: https://l7maps.streamlit.app/
- Size: 20.7 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
- License: LICENSE
Awesome Lists containing this project
README
streamlit L7
[L7](https://github.com/antvis/L7) is a Large-scale WebGL-powered Geospatial data visualization analysis framework. [Live Demo](https://l7maps.streamlit.app/)
## Installation
```
pip install streamlit-L7
```
## Usage
```py
import streamlit as st
from streamlit_L7 import L7
options = {
"mapType": 'Map',
"layers": [
{
"type": 'raster',
"source": {
"data": 'https://tiles{1-3}.geovisearth.com/base/v1/ter/{z}/{x}/{y}?format=webp&tmsIds=w&token=b2a0cfc132cd60b61391b9dd63c15711eadb9b38a9943e3f98160d5710aef788',
"parser": {"type": 'rasterTile', "tileSize": 256, "zoomOffset": 0},
},
},
{
"type": 'raster',
"source": {
"data": 'https://tiles{1-3}.geovisearth.com/base/v1/cat/{z}/{x}/{y}?format=png&tmsIds=w&token=b2a0cfc132cd60b61391b9dd63c15711eadb9b38a9943e3f98160d5710aef788',
"parser": {"type": 'rasterTile', "tileSize": 256, "zoomOffset": 1},
},
},
{
"type": 'choropleth',
"autoFit": True,
"source": {
"data": {
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {
"name": "矩形"
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[120.554285, 30.145225],
[120.554285, 30.482327],
[120.865317, 30.482327],
[120.865317, 30.145225],
[120.554285, 30.145225]
]
]
}
},
{
"type": "Feature",
"properties": {"name":"多边形"},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[120.016222, 30.382493],
[120.270497, 30.396202],
[120.263686, 30.204106],
[120.032115, 30.213916],
[120.016222, 30.382493]
]
]
}
}
]
},
},
"fillColor": {
"field": 'name',
"value": ['#fc8d59','#ffffbf','#91bfdb'],
},
"opacity": 0.8,
"strokeColor": 'blue',
"lineWidth": 1,
"state": {
"active": { "strokeColor": 'green', "lineWidth": 1.5, "lineOpacity": 0.8 },
"select": { "strokeColor": 'red', "lineWidth": 1.5, "lineOpacity": 0.8 },
},
"label": {
"field": 'name',
"visible": True,
"style": { "fill": 'blue', "fontSize": 12, "stroke": '#fff', "strokeWidth": 2 },
},
},
],
"controls": [
{
"type": 'zoom',
},{
"type": 'scale',
},{
"type": 'fullscreen'
}
],
}
L7(options=options, style=None, key="streamlit_L7")
```
## API
Now, There is only one API for `streamlit-L7`, named `L7`, see the `options` in [L7 React component API](https://larkmap.antv.antgroup.com/components/lark-map).
| Property | Description | Type | Default |
| -------- | --------------------------------------------------------------------------------------------------------------- | --------------------- | ------- |
| options | the [options](https://larkmap.antv.antgroup.com/components/lark-map) for the visualization, say `chart.options(options)` | `L7options` \| `null` | - |
| style | the style of the container | `CSSProperties` | - |
## Development
- Build frontend code by running `npm run build` in fold `streamlit_L7/frontend`.
- Run the example by running `streamlit run app.py` in root dir.
## publish
- Build frontend code by running `npm run build` in fold `streamlit_L7/frontend`.
- Build python `python setup.py sdist bdist_wheel`
- publish `python -m twine upload dist/*`
## License
MIT@[lzxue](https://github.com/lzxue).