0

I am using geojson-dashboard framework template for Leaflet (http://fulcrumapp.github.io/geojson-dashboard/).

enter image description here

By default, the initial view of the screen is "splitted" or "divided" (half view is the map and the other half is a geojson table). What I'm trying to do is to modify the function in order to set the initial view of the screen only with the map.

The function that acts on that is the following:

function switchView(view) { if (view == "split") { $("#view").html("Split View"); location.hash = "#split"; $("#table-container").show(); $("#table-container").css("height", "55%"); $("#map-container").show(); $("#map-container").css("height", "45%"); $(window).resize(); if (map) { map.invalidateSize(); } } else if (view == "map") { $("#view").html("Map View"); location.hash = "#map"; $("#map-container").show(); $("#map-container").css("height", "100%"); $("#table-container").hide(); if (map) { map.invalidateSize(); } } else if (view == "table") { $("#view").html("Table View"); location.hash = "#table"; $("#table-container").show(); $("#table-container").css("height", "100%"); $("#map-container").hide(); $(window).resize(); } } $("[name='view']").click(function() { $(".in,.open").removeClass("in open"); if (this.id === "map-graph") { switchView("split"); return false; } else if (this.id === "map-only") { switchView("map"); return false; } else if (this.id === "graph-only") { switchView("table"); return false; } }); 

I've tried in a thousand ways but I don't know how to solve in order to establish "Map View" as the initial view.

1 Answer 1

1

Looking at your code and the config code, this is what happens when you want map only on start.

$("#map-container").show(); $("#map-container").css("height", "100%"); $("#table-container").hide(); 

Just need to put it in the function that's loaded last. Maybe something like:

 $(window).load(function() { switchView("map"); }); 
3
  • Many thanks for answering. I've tried with your suggestion and seems that is happening something interesting: when loading the web page, the map "is trying" to be shown at 100%; however, below on the screen remains an "empty place" which is the table that doesn't just disappear completely: The table itself is not visible, but it is the space that the table occupies on the web.. Commented Aug 8, 2018 at 8:44
  • I updated my answer and tested it, it should work for you now. Commented Aug 8, 2018 at 12:50
  • :) if in fact, it works much better! but it seems that there is still needed to modify some function of the whole code that insists on showing the half table-container while the web page is loading. Also, i should fix the "feature extent" (the map looks centered on muy features coordinates but with a lower zoom level than my features extent). Anyway, I've already come so far thanks to your help. very grateful Bill. Commented Aug 8, 2018 at 18:07

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.