feat: replace map _height with height
#816
Draft
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…string for the height of the lonboard div. set the map div inside the lonboard div to be 100% height/width always
…d by the App function in index.tsx
…not an integer so we can pass values like '300px' or '100%' set the height/width of the layout of the widget to 100% mark the body overflow to hidden so if it's inside a smaller container, it wont overrun it or make some scroll bars show up
…ionality of how `_height` worked
shows the behavior of the height functionality
ATL2001
changed the title
_height with height_height with height
kylebarron
reviewed
Jun 24, 2025
lonboard/_map.py
Outdated
| @@ -177,7 +179,7 @@ def on_click(self, callback: Callable, *, remove: bool = False) -> None: | |||
| Indicates if a click handler has been registered. | |||
| """ | |||
|
|
|||
| _height = t.Int(default_value=DEFAULT_HEIGHT, allow_none=True).tag(sync=True) | |||
| height = t.Unicode(default_value=DEFAULT_HEIGHT).tag(sync=True) | |||
There was a problem hiding this comment.
I don't really want to have a breaking change here, so if we allow strings here, it should be a t.Union of strings and integers (or at least we need to validate that we can pass in an integer and it'll get converted to a string, but we probably want to add a px suffix?)
|
It would be really nice if the HTML export automatically filled the entire window: Map([]).to_html("test.html")gives: |
|
oh yeah, this exporting as height 100% looks really sharp! you want a map, you get a map! 💥 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
per what we discussed in #781 I believe I've come up with a good solution here. I had to add some CSS to the data-overlay-container which appears to be generated by the typescript which the lonboard div is housed in. and then I needed to make some tweaks to the map div which lives inside the lonboard one as well. then I changed
_heighttoheightand tweaked the way the default was setup so as to not make the default functionality of the creation of the map change.but now if the user knows they want to put the map into an IFrame or some other container that has a fixed height, they can specify
height="100%"and the map will fill the container's height.I also checked in an example notebook so you can check the behavior yourself. I do not intend to keep that in there (unless you think it would be a benefit for others, if so I should probably retool it to make it a little nicer)
If this looks good let me know and I can find some time to update the docs so they match the behavior 👍