Allow styles to configure a custom renderer

Two new examples show how custom renderers can be used to render text along
paths, and to declutter labels using 3rd party libraries.
This commit is contained in:
Andreas Hocevar
2017-07-15 00:06:35 +02:00
parent 2258c00fca
commit c6b942f185
21 changed files with 762 additions and 72 deletions

View File

@@ -0,0 +1,20 @@
---
layout: example.html
title: Street Labels
shortdesc: Render street names with a custom render.
docs: >
Example showing the use of a custom renderer to render text along a path. [Labelgun](https://github.com/Geovation/labelgun) is used to avoid label collisions, and [linelabel](https://github.com/naturalatlas/linelabel) makes sure that labels are placed on suitable street segments. The data is fetched from OSM using the [Overpass API](https://overpass-api.de).
tags: "vector, label, collision detection, labelgun, linelabel, overpass"
resources:
- https://cdn.polyfill.io/v2/polyfill.min.js?features=Set"
- https://unpkg.com/rbush@2.0.1/rbush.min.js
- https://unpkg.com/labelgun@0.1.1/lib/labelgun.min.js
cloak:
As1HiMj1PvLPlqc_gtM7AqZfBL8ZL3VrjaS3zIb22Uvb9WKhuJObROC-qUpa81U5: Your Bing Maps Key from http://www.bingmapsportal.com/ here
---
<!-- Wrap https://npmjs.com/package/linelabel -->
<script>var module = {};</script>
<script src="https://unpkg.com/linelabel@0.1.1"></script>
<script>var linelabel = module.exports;</script>
<div id="map" class="map"></div>