This is a Web-Map plugin that aims at displaying data from the TransforMap API. It offers dynamic filters, which are built from a Wikibase graph hosted on base.transformap.co.
To embed the TransforMap-Viewer into your own website, the simplest way is via an iframe:
<iframe width="1200" height="500" src="http://viewer.transformap.co/#5/51.166/10.451"></iframe>
You can change the background layer via the param "background" (e.g. src="http://viewer.transformap.co/?background=mapnik#5/51.166/10.451"). Currently 4 layers are supported:
If you want to change anything else, e.g. color scheme or the displayed data, fork it and embed it from your fork's gh-pages.
Translation for the filter-menu are directly fetched from Wikibase. All other strings are are handled via weblate.transformap.co. You can help translating, just sign up! It stores its translations here: https://github.com/TransforMap/transformap-viewer-translations.
Note: The English translations are handled in the source repository directly.
To add new strings, you have to add them currently manually to scripts/map.js and in the translation repository, to each of the language files in json/*.json.
This service relies heavily on different linked data backends, see flowchart:
Is created via less.
Do not edit the CSS file in styles/css/style.css, edit styles/less/style.less and compile to css.
Install node less compiler to convert the stylesheet to less css:
aptitude install node-less
npm install less -g
Compile it via :
lessc styles/less/style.less styles/css/style.css
Install bower from npm:
[sudo] npm install -g bower
Debian: install npm:
[sudo] aptitude install npm nodejs-legacy
Fetch external dependencies:
bower install
The site http://viewer.transformap.co/ is actually hosted at github.io. Just push the branch gh-pages to update the site.
Notes: for libraries used with bower, add a static copy of the files to the gh-pages branch to its location in bower_components/ (and add an exception to the .gitignore-file).
Run npm install
once to install needed development dependencies.
Then, run npm run build
each time js and/or css has been changed to update the content in the /dist
folder.
We use spaces (2) instead of tabs, please also use this convention.
Currently, there are 3 "branches" of development: