When clicking on the tab the heatmap.html is “fully” loaded – and Narrated Website is “gone”. I would rather have the heatmap included in the main area of the Narrated Website so that whole context of Header with tabs and footer and styling remains the same. To still have the whole navigation and a real integration.
I thought that the easiest would be if the heatmap.html could be inserted as an iframe into the Narrated Website’s Extra Page. But I see no easy way of doing it.
Only way - but still hackish - might be to copy and paste the header and footer parts of the Narrated Website into the heatmap.html.
Is there a way to change the order of the Extra Page? At the moment it would be the 2nd tab after Homepage “Startpage”. I think that having at 7th position (between “Places” and “Media” would make more sense in my use case.
You can manipulate the order of the tabs in the same code I highlighted in the previous thread.
I have only explored the Heat Map when it first came out.
To more fully integrate any extra page in the NarrWeb, take one of the main pages created by the NarrWeb (i.e. index.html) rename it then strip out most of the code leaving the header, footer, and navigation sections and insert the code for your extra page.
EDIT: Note: Since extra pages may not be related to Gramps, attribution in the footer may need to be modified.
I think this pretty much depends on the use case and size of the data. For smaller data sets I think that one global heatmap is enough. For larger data sets, I think that for each family/surname a dedicated heatmap might be cool.
I only have like 250 people. So for my use use I would like to have only a global heatmap with all events.
As it depends on the use case and size of data: Why not offer all the above possibilities (with sane defaults).
Regarding the Heatmap: What I found lacking is that one cannot jump from the map to the specific event. For instance, on the map I see that something happened in an distant country like USA (from my German perspective) but there is nothing I can click on to find out easily what event happened there when and who (person) was involved.
Thanks. Maybe this helps some other people two. I automated this task with a small bash script based on html-editor-cli for replacing html tags:
cp -R $LOCAL_ROOT/heatmap/ $LOCAL_AHNEN_DIR
HEATMAP_CONTENT=$(cat << EOM
<p id="description">
Diese Karte zeigt an, an welchen Orten die Personen des Stammbaumes am häufigsten geboren, gelebt, geheiratet haben usw. usf. Man kriegt also einen guten Überblick über Migration innerhalb seiner Ahnen und Familie.
</p>
<iframe
src="heatmap/heatmap.html"
width="100%"
style="height: 60vh"
></iframe>
EOM
)
cat $LOCAL_AHNEN_DIR/index.html | html-editor-cli --query "#Home" --content "${HEATMAP_CONTENT}" > $LOCAL_AHNEN_DIR/heatmap-index.html
The generated heatmap-index.html is then used as a Path in an Extra Page.
We can never do anything about it. Heatmap is created by a javascript application that only shows places where there are events. It’s just an event counter. Moreover, we do not have control over the calculation.
The Heatmap addon uses Leaflet for its maps. See Leaflet layer groups if you want to include a layer switcher.
Right now the heatmap only shows the density of places and also shows all events with the same place as one point (=better performance, but less information). See original post
You would have to rewrite the addon to export all event data or at least the gramps_ids/handles, which are needed to link to the right pages. I don’t know how exactly the narrated web report generates the links/pages but probably something like http://website-name.domain/persons/<id>. Keep in mind that a place often has more than one event, so you need a way show a list of links or a table of all event data (if you export the event data).
Instead of the current OpenLayers map in Narrated Website I thought of an OpenLayers map with several toggable layers (with a switcher), i.e. one map but several layers:
one layer as now with clickable markers
one layer with an Heatmap (OpenLayers also supports Heatmaps, see Earthquakes Heatmap and OpenLayers v8.2.0 API - Class: Heatmap ) – I was thinking the work you are doing atm on integrating a heatmap into the Narrated Website would be based on OL not Leaflet)
I was referring to the integration that @SNoiraud is working on within the Narrated Website, not the Heatmap addon itself. Since Narrated is using OpenLayers I thought the planned Heatmap there would also use OpenLayers’s Heatmap.
PS I do not aim to talk you into something. Do what seems best for you and others. And it is Free Software and done in spare time. Just giving some feedback on my (individual) use case - which might help.
Gramps is a brilliant software. When I started was given some Powerpoint, Word and Excel data - and it is so much better with Gramps. I did not even know about the Narrated Website addon when I started using Gramps (I think exporting to a website is not listed at Gramps – Free Genealogy Software » Features ) though this is now a real benefit to be able to easily share findings with my non-tech-savvy relatives. so thanks so much
Really pretty cool. I especially like the fact that mouseover shows a tooltip and on clicking one gets a little popup with more infos and links to persons.
Just listing a few minor issues I noticed. Referring to this screenshot which has some all captured:
There’s a whitespace missing in the popup between person and Event name. Francis, Elizabeth: Tod not Francis, Elizabeth:Tod
It is not easy to recognize clickable links. Links are not styled in any other way than normal text. This is an issue I think I also have with other parts of the narrated web pages. So one has to use mouseover over a text to see if it gets underlined or not. Especially on mobile/tablet where you do not have a mouse this is an issue.
It would be cool if the popup would also have a link the place name. So in the screenshot maybe link the title Little Rock, Pulaski, AR, USA to the actual place page.
Right to the title the popup closer looks a little bit misaligned. I think it should be a like 5-10px lower to be aligned with the title. Also maybe add some padding to the closer so that the clickable surface gets bigger and is easier to click or tab with finger.
ATM it’s just 14x19px
While hovering over the popup the mouseover tooltip behind from the map still shows. Like Mountain Home in the screenshot. This is a common OL problem. The mousever needs to be disabled while the mouse is over the popup. Here’s a link to one solution: javascript - OpenLayers 4 popup, prevent pointer to target data behind a div - Geographic Information Systems Stack Exchange but this totally disables all mouseover while a popup is open. What you would want is to disable the tooltip only when the mouse is within the popup. So on mouseenter of the popup disable the tooltip event listener, and on mouseleave enable it again. Not sure if this helps openlayers 3 - How to disable events - Stack Overflow . In the end it is rather plain JS about enabling/disabling OL tooltip events.
