bmcbride/bootleaf

Template for building simple and elegant web mapping applications with Bootstrap and Leaflet

bootleaf's Issues

Making App.js generic?

Hi! I started using BootLeaf, and I was wondering why museums, theaters, subways and boroughts are hard-coded in App.js? Let's say I want to use BootLeaf to show a list of hotels, this means I need to modify App.js, making it impossible to update it with your new release. Or may be there is something I didn't get right?

By the way, fantastic work : BootLeaf is a unique project and I enjoy it!

Leaflet sidebar being removed

Hi Bryan,
thanks for your very nice project. I use it as a template for my thesis. I noticed that you decided not to use the leaflet sidebar plugin anymore. Is there a specific reason for that? Or is it just that you wanted to use plain bootstrap? I kind of liked the animation it came with. Now i'm not sure if i want to upgrade to the new version.

Update to Bootstrap 4.1?

Hi, thanks for this template... it's really unique since it has everything needed to start a new project with leaflet 👍

Are there any plans to update to BS4?

Thank you!

marker cluster

Hi, thanks for great works !

i suggest the plugin https://github.com/Leaflet/Leaflet.markercluster.

it improve the Display Performance when there are many markers on the map.

good day

Update to Leaflet 1.0.3

Hello,

The example doesn't work if changes Leaflet version to 1.0.3.

Any idea?

Thanks in advance.

Display Error in Chrome

Hi Mr McBride

I have been having some issues displaying the GEOJSON's in Google chrome. When I open the page the loading bar displays over the map and the GEOJSON's fail to display, in addition the lists are not searchable as it appears not to be reading any of the GEOJSON content. It works perfectly in Firefox but I would like to be able to use it on other web browsers, eventually in an offline networked environment pointing to an map server.

I would greatly appreciate any advice you may have.

Thank you!!

Kesh

Low Performance +10k Markers

Anyone tried loading more than 10k markers?

The whole map behaviour is clumsy and/or crashes. Initially I tought it was due to load time (6mb geojson), but after reduzing size to its tenth by gzip compressing im still experiencing clumsy behaviour.

Is it possible that the sidebar is responsible for the browser to crash when loading tons of markers? Often markers are visibly loaded and just as I move the map somewhere else, sidebar starts doing the sync. So I though it might be useful getting rid of the sidebar for testing.

Any insights?

Lengthy content in .navbar-brand obscures layer selector on mobile devices

Hi Bryan,

Thanks for your effort and time in making bootleaf.

Making a lengthy title on the main page will result in the layer selector to be partially obscured on some mobile devices.

I first encountered this on my Samsung S5, Android [4.4.4.], firefox 35; also on Chrome 40.0.2214.89 and included a screenshot below
I was also able to reproduce it for a few other mobile devices using the Developer Tools on Chrome.

A reproducible example, which uses the latest release from master is, at http://skorasaurus.github.io/bootleaf

The map doesn't load at the opening of the index

Is there a problem related to the source code? There is a permanent loading bar who is locking the view....

whats edit?

login id and passward what?
i'm don't engilsh sorry

1. what edit map data?
2. what map change google?

How to customize bootleaf

How i can customize bootleaf with my own geojson file?
I have added geojson but unfortunately it won't show, or sometime show but keep loading.

Adding Realtime locations to bootleaf

I am quite comfortable with bootleaf and so far so good.I had a question which is an out of the box.I noted the locations are loaded from geojson files which are part of the codes.Is there a way a user can add a location and choose a category whether a theater or museum or whatever and the coordinates are saved maybe in a db then retrieved?

List text disappears using Chrome on Retina display

Probably an issue for a small subset of users, but when loading BootLeaf in Chrome (Version 35.0.1916.153) with all extensions disabled, on a Retina display (Macbook Pro, OS X, Version 10.9.4), the list text disappears and generally acts funky. When loaded on the Retina display, it looks like this:

Dragging Chrome to a non-Retina display, it immediately looks like this:

I can confirm that it does not happen in Safari Version 7.0.5 (9537.77.4).

Login Tool

I love this tool. I have returned to it time and time again. However, I am unsure of how to implement the login function tho. What is the easiest and most straightforward way of utilizing the login before loading the map or layers? Should this happen via js or php?

Geojsons are not displayed in demo

Hello,
I am quite impressed by this combination of bootstrap and leaflet! I really want to use it for a little project. But I am having difficulties with the downloaded version: it doesn't show the Geojsons (Museums, Theaters, Boroughs and Subways) – They don't appear in the downloaded version. And I am to new to js. to find the error by myself.
So could you please check the data you gave for download? Thanks!

Typeahead search functionality with 'enter' button

When hitting 'enter' while in the search box the map will re-load as if the user refreshes the page, even if results are displayed in the search box.

The enhancement could include either a zoom to the top search result, no functionality (disable the re-load), or additional options.

Cannot change startup position

map = L.map("map", {
zoom: 20,
center: [10.702222, -73.979378],
layers: [cartoLight, boroughs, markerClusters, highlight],
zoomControl: false,
attributionControl: false,

});

I just change numbers between brackets and I didn't saw any results

animation not working

The sidebar display animation is not working correctly. The css says "ease-transition", but the sidebar does not look like respecting that. Tried changing that transition duration to 10 sec (just for testing), no change in the animation - it hides/shows abruptly.

Here is an example of what I am after: http://ironsummitmedia.github.io/startbootstrap-simple-sidebar/

Bootleaf Update to Leaflet 1.3.1

I am trying to update bootleaf with library leaflet version 1.3.1 and it works. I have push in my fork, please go to:
https://github.com/anshori/bootleaf/tree/leaflet_1.3.1

Good luck

Search and map layers not displaying

Hi there

I downloaded the zip file and unzipped it onto my web server but am having some problems as I cannot seem to be able to retrieve results from the search box or add the map layers.

I tried saving all of the externally referenced css and js files to my local server but this didn't help, not sure if there are any settings I need to alter at all after downloading and unzipping the zip file?

Thanks

Make navbar collapse when modals are launched on mobile

This used to work. Check navbar class/ id.

Adding MarkerClustering

I saw the closed issue for the markerclustering plugin. Where would I add it in the Bootleaf code? I've yet to get it working with the template.

Mobile Safari: side bar items have to be tapped twice to trigger feature info modal

When using a bootleaf-based site in mobile safari in iOS, tapping an item in the side bar doesn't trigger the feature info modal. On the first tap the item's hover state is triggered. On the second tap, the feature info modal displays. The feature info modal should show after the first tap. Specific steps to reproduce:

1. open the demo site in mobile safari
2. tap an item in the side bar, e.g. "Acorn Theater" (note that it gets a gray background color, per the li's hover state
3. tap "Acorn Theater" again and the feature info modal shows

Step 3 shouldn't be necessary.

search dropbox not displaying result content

Hello,
I'm quite new to everything and don't know if I'm doing that right. But I add the issue where taking the code as it is with the latest version of typeahead (11.1), the content of search was not displaying:

I had to change:
suggestion: Handlebars.compile(["{{name}}<br>&nbsp;<small>{{address}}</small>"].join(""))
to
suggestion: Handlebars.compile('<div>{{name}}<br>&nbsp;<small>{{address}}</small></div>')

It might be trivial for some, not for me... I guess it has to do with the new version.
Just thought some people might be interested...
sorry if this this is not the way of suggesting modification

And a big thanks for writing this really cool plugin!

Incompatibility with Leaflet-easyPrint plugin

When adding the Leaflet-easyPrint plugin using the Bootleaf template, the Print icon control appears on the map but doesn't react. I tested Leaflet-easyPrint plugin without using Bootleaf and it works well. Somebody knows how to fix?
Thanks

Load BootLeaf in Bootstrap modal

Hi Bryan.
compliments for the client "BootLeaf" that I really like.
I just have a problem that occurs when you load the client in a Bootstrap modal that displays the map, but fully zoomed out.
Could you give any indication on how to solve the problem?
Thanks in advance

Sync POI list with map content

First of all I would like you to compliment for this great template!
I'm having a suggestion, a usability approach: it would be nice for the user if the POI list would refresh with the content of the map (more items if zoomed out, less if zoomed in). Only the POI displayed on map should be named in the POI list.

Windows Phone 8.1 IE screen rotation intermittent glitch

Hi,

I've found an interesting problem with Bootleaf rendering on WP8.1 IE. Sometimes when I rotate the screen from portrait to landscape part of the screen doesn't get rendered. It happens approximately once out of three times. Refresh helps.

I've tested it on other browsers and other devices - works like charm. Freaking mobile IE!
Tried to workaround it myself - forcing to redraw the #container element - no luck.

I guess it's more a bug report for the Microsoft folks.

Page crashes on aerial/hybrid rectangle zoom

Map is crashing on SHIFT+mouse rectangle zoom on aerial and hybrid basemaps.

Coordinate system

How could you modify to another CRS system for example CRS: 32719

Sidebar slide over map

Is there a way to modify the sidebar to slide over the map? I'm working on an application where I have components to the right of the map and it would be better if they didn't get pushed to the bottom when the user wants to use the markers list.

Map center should be determined by map.center property and not geoJSON layer

Just a suggestion for users picking this up for the first time. I tried to change the map center and was confused why it was still initializing over NYC even after I'd changed map.center.

Rather than setting the map center when loading a geoJSON layer (lines 523-527 of sidebar.html:

$.getJSON("data/boroughs.geojson", function (data) {
    boroughs.addData(data);
}).complete(function () {
    // responsible for map center
    map.fitBounds(boroughs.getBounds());
});

You should rely on the map.center property. In the sidebar example, even if you change the center property the map still loads in NYC because of the $.getJSON call.

map = L.map("map", {
    zoom: 10,
    center: [40.702222, -73.979378], // changing this doesn't change map center
    layers: [mapquestOSM, boroughs, subwayLines, theaters]
});

Dynamic loading of markers via AJAX based on current map view bbox

I always feel guilty asking for new features on free softare, but I was wondering if you had ever thought of adding dynamic loading of markers on map move / zoom by passing bbox parameters to a public API such as Flickr? Do you think this would be hard? I'm willing to give it a try if you have any pointers.

Bootleaf & GpPluginLeaflet-src.js

Hello

I like bootleaf and this plugin GpPluginLeaflet-src.js
With this we can play on order and opacity of each layer

I try to use this on bootleaf without success, have you an idea ?
http://www.test.pyrenees-refuges.com/leaflet/bootleaf-master/

Thanks

Tried to load bootleaf with vuejs but not able to render map

Hello,

I tried to load bootleaf into Vue js but the map is not getting loaded. I didn't get any error as well. Does anyone do that before?

Thanks.

Internet Explorer problem

Dear Sir,
Thanks for this wonderful template. I am going to use this template for our Vehicle Tracking System project. But the problem is that sidebar.html file not working in Internet Explorer. Please check and fix it as soon as possible.

BR
Himanshu Srivastava

right panel

hi, great job!

There a few demos online using a double sidebar?
One to the right and another to the left of the map keep responsive behavior

Request a Webjars artifact for dependency management

It would be nice to have this project as a classic maven artifact.

The owner can easily create a request online:
https://webjars.herokuapp.com/request

Thanks.

Putting content above the navbar

Hi, great work with the Bootleaf. It is extremely useful but I can't gest past a one thing - when I put some content above the navbar or between the navbar and the map. The new content is visible just fine when clicking the sidebar, navbar, search, etc. But as soon as the map is clicked -puff - the map and sidebar expand toward top of the screen and my content is covered.

To recreate it just put something like <div class="container">My new content</div>[/code] directly behind the <body> tag.

I can't find what causes the map to reset the layout on clicking. I thought there was something with map.on("click") but nope. Any help? I think the solution would be useful to wider audience, because it is rather typical to put some kind of a logo on top of the page.

Update to List.js v 1.2

Playing around with bootleaf i got some issues by updating tables.
Updating List.js to version 1.2 and use the new reIndexing functionality worked for me.

Support for Right Sidebar

It would be great to see bootleaf offer an option for a right sidebar.

leaflet 1.0 notes

Hi,

Not sure when you plan to migrate to leaflet 1.0 but I was curious and wanted to try it out.
I was able to get bootleaf your master up and running with leaflet 1.0.0-beta1.

I locally used the master build on the leaflet website which at the time of my download was also the 1.0.0-beta1 release

After modifying my local paths to use the local leaflet, I had this error from markercluster when opening index.html

After building markercluster at this commit from the leaflet-master branch, I added it to my local instance of bootleaf and played around with it and didn't see any abnormal behaviors; clustering markers, filtering locations, etc.

If you want to examine it locally, just follow the above directions or clone https://github.com/skorasaurus/bootleaf/tree/leaflet1

Geojson Formatting

Not an issue. Just a question. I am getting invalid geojson errors in the console while trying to implement my own data via app.js. I was wondering where your geojson was created to try to match the formatting?

Bootleaf and leaflet-realtime.js

I am reading geojson files on a regular interval using leaflet-realtime.js within Bootleaf. The position does change automatically on the map but the popup content used by Bootleaf does not get updated with the new information within the newly read geojson file and a new entry keeps getting added (append) to the sidebar list.

I have posted some details here:

https://stackoverflow.com/questions/49269487/updating-features-with-realtime-and-leaflet

Any chance you may be able to help?

How to stack the sidebar below the map in mobile display

In the portrait devices, the height is more than width, which makes the sidebar good to go "below" the map (stacked vertically) rather than share the same small horizontal width.

How to achieve this effect with this template/theme? I tried making the sidebar and map asas col-xs-12 (and col-md-8 and col-md-4) - but it did not work.

It would be great if you could provide a way to achieve this. Essentially I would like to have the map take 100% of width on the small screen and below it (somewhere around 50% of the height) the sidebar should start displaying its content in a scrollable view

searchpush for line features

Hi,
I'm a rookie in programming and I'm really grateful for this template. I have noticed that the search features work only for polygon and point geojson. Kindly advice on how to enable search for line geojson features?