Skip to content

lacemap/lacemap.github.io

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Points of interest related to handmade lace

A map to share on websites of lace guilds, teachers, artists and collectors. Anyone can contribute, a team of volunteers moderates it centrally. The map originally appeared on the LOKK website (the national Dutch lace guild) as schown by thi archived version. When google discntinued or changed its serviced, the map moved to an open source platform.

Get involved

How to contribute to the markers on the map is explained at the bottom of the demo page.

A glitch free translation for the text around the map would be appreciated. Automated translation don't do a very bad job for Dutch, German or French but it might be an advantage for search engines to have an explicit translation. On the other hand it increases the burden on maintenance.

Deploy your own copy of the map

Various options allow to deploy your own copy of the map and stay (partially) in sync or not. Just two methods are sketched below. Please note the terms of use for the tile server you choose: requiring an account, payed or not, allowing commercial use or not etc.

Just a customised address

The master lace map is deployed at http://lacemap.github.io/

  • Create your own fork with the button at the top of this page, let us assume with an account name my-org.
  • Go to settings, rename the repository lacemap.github.io to something of your choice, let us assume lace-map.
  • Further down between the settings choose the master branch as publishing source.

With the assumptions above, you should now have a map in English at https://my-org.github.io/lace-map and a Dutch version at https://my-org.github.io/lace-map/NL. Github explains how to configure your own domain on the same settings page.

Now wait for updates that come as pull request messages issued by the lacemap account and merge them or read the instructions for a more technical approach to stay in sync. After merging, you can check at https://github.com/my-org/lace-map/deployments whether the changes are published. It may take another ten minutes for your browser to see the changes.

Copy all assets

This allows your own selection of entries on the map and other variations. It assumes some knowledge of HTML and JavaScript and the right to deploy custom JavaScript on your website.

  • Extract assets plus index.html and/or NL.html out of the download.

  • Open the .html page(s) with your favorite (plain text) editor.

  • Replace the content of the <body> section with your own text and apply your own styles, keep at least:

    <div id="map"></div>
    <script>
        // laceMap.addTiles = function (map) {
        //     L.tileLayer(...).addTo(map);
        // }
        laceMap.load({ containerID: 'map' });
    </script>
    
  • Note that the map <div> needs a predefined size. The initial fixed size limits the number of tile requests. The subsequent max values (with viewport percentages: vh / vw) is for smaller devices. The max-width for the attribution leaves some space fot the scale control on smaller devices.

  • Open the .html page(s) in a browser and the map should show.

  • Subscribe (at least) to the history of assets/map-config.js to get notified of new/changed entries. Replace the raw content of a changed file to get up to date.

How to embed and blend the page into your website completely depends on your implementation.

Tile service

For another tile server edit your copies of the .html pages. Fill in the dots (see the overview of providers) and activate:

laceMap.addTiles = function (map) {
      L.tileLayer(...).addTo(map);
 }

Please extend the attribution with:

'Points &copy; <a href="https://github.com/lacemap/lacemap.github.io/" target="_top">lacemap</a> contributors'

Note the terms of use for the provider of your choice. The default settled for an alternative that gives German labels along the local labels, allowed only for non commercial use.

OSM requires a cache of 7 days, that is 604.800 seconds, github's cache-control header is set to only max-age=525010. A French variant allows only "marginal" traffic, whatever that may be. A service that requires an api-key would disable the "Just a customised address" option. Note that these estimates may mean that one or two unique visitors per day may mean some 1K tile requests per month. Visitors returning within the caching period might or might not cause new tiles requests, depending on their zooming and panning behaviour.

Options for laceMap.load()

An alternative with an initial focus on France:

laceMap.load({
  containerID: 'map',
  bounds: [[51,4],[42,8]],
  xyPrompt: 'Vous avez cliqué sur la carte à:'
});
  • containerID mandatory. The id of the HTML container for the map, this id should be unique on the page.
  • xy optional, default [0,20]. The initial centre of the map. Click the map at the desired centre for the coordinates, swap the numbers.
  • zoomlevel optional, default 1. The initial zoom level of the map.
  • xyPrompt optional, default 'You clicked the map at:'. The text in the popup when you click an empty area of the map. The content and language of object popups is at the choice of the lacemap moderators, perhaps a local language and English.

Advanced options

For more advanced options and additional leaflet plugins you'll have to adapt your copy of assets/map-config.js.

About

A map with points of interest related to hand made lace.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published