npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@wikimedia/kartotherian

v1.1.13

Published

Renders map tiles

Downloads

19

Readme

Build Status

Maps Tile service for Wikipedia

This code is cross-hosted at gerrit

Maps nodejs server for vector-based tiles and snapshots, designed for Wikipedia and other sites. It ties together a number of MapBox components for vector and raster rendering based on Mapnik 3, and uses service runner for scalability, performance monitoring and stability.

Serving tiles

Kartotherian can serve vector and raster tiles in multiple formats and optional scaling:

http://.../{source}/{zoom}/{x}/{y}[@{scale}x].{format}
  • The sources are configured with the source config file. Sources configuration supports different methods of tile storage, such as HTTP or files, generation from postgress db, overzoom to extract the tile from lower zooms if missing, layer extraction, mixing multiple sources together, etc.
  • Optional scalling can render larger images for high resolution screens (only those enabled in the source, e.g. [1.5, 2])
  • Supported formats include PNG ang JPEG, SVG, PBF vectors, and JSON (with nogeo and summary debug options)

Static map images

Kartotherian supports static image generation. Users may request a PNG or a JPEG snapshot image of any size, scaling, and zoom level:

http://.../img/{source},{zoom},{lat},{lon},{width}x{height}[@{scale}x].{format}

# image centered at 42,-3.14, at zoom level 4, size 800x600
http://.../img/osm-intl,4,42,-3.14,800x600.png

# the same but for higher DPI device with 1.5 scaling
http://.../img/osm-intl,4,42,-3.14,[email protected]

Info data

Kartotherian can be used as a source of the PBF data for Mapbox studio. See info about style editing in osm-bright-source. The info data is available at http://.../{style}/pbfinfo.json for pbf source, and http://.../{style}/info.json for the styled image source.

Markers

Kartotherian can generate marker images by wrapping any of the maki icons with a pushpin image, in any color. The URL schema is matched to the one used by the mapbox.js.

http://.../v4/marker/[email protected]
http://.../v4/marker/ {base} - {size:s|m|l} [-{letter-or-digit-or-icon-name}] + {color} [@2x] .png

At this point, only "pin" is supported for the base. The color is a 3 digit or 6 digit hex number. Optional scaling can only be 2x. Beyond the pre-defined maki icons, you may give a number (0-99), a single letter (a-z), or nothing.

Very quick start

git clone https://github.com/kartotherian/kartotherian.git  # Clone the repository
cd kartotherian
npm install
node server.js -c config.external.yaml

Browse to http://localhost:6533/ The set up inside sources.external.yaml does not use any storage or caching, so it will not be suitable for production. You will need to to set up your own local database as described in osm-bright.tm2source, which is installed in node_modules/osm-bright-source, and configure additional source chains and setup a proper storage to make this into a production system.

Configuration

Inside the conf key:

  • sources - (required) Either a set of subkeys, a filename, or a list of file names. See core on how to configure the sources.
  • variables (optional) - specify a set of variables (string key-value pairs) to be used inside sources, or it could be a filename or a list of filenames/objects.
  • defaultHeaders (optional, object) - a set of extra headers that will be sent to the user unless the source provides its own. (public requests only)
  • headers (optional, object) - a set of extra headers that will be sent to the user instead of the headers returned by the source. (public requests only)

For the rest of the configuration parameters, see service runner config info.

Components

Kartotherian platform consists of a number of elements, some of which conform to the general specifications established by MapBox, and therefor can reuse components that confirm to the same specification.

Components by Wikimedia Foundation

  • kartotherian-core - Loads and configures tile sources, and provides some common utility functions
  • kartotherian-server - Handles user requests for tiles and source info, as well as registers additional data type handlers like maki markers and image snapshots.
  • kartotherian-maki - Request handler for maki markers - generates PNG marker images that can be used from geojson.
  • kartotherian-snapshot - Request handler for static images by combining multiple tiles into one snapshot image of a requested size.

Tile sources

  • kartotherian-autogen - Tile source that checks "storage" source for a tile, and if not found, gets it from the "generator" source and saves it into the "storage"
  • kartotherian-demultiplexer - Tile source that combines multiple sources by zoom level
  • kartotherian-overzoom - Tile source that will zoom out if the requested tile does not exist, and extracts the needed portion from the lower-zoom tile it finds.
  • kartotherian-substantial - Tile source that filters out tiles that are not significant - e.g. nothing but water or land.

Data and Styling

  • osm-bright-source - SQL queries used by the tilelive-bridge to generate a vector tile from Postgres Database
  • osm-bright-style - Style used by the tilelive-vector to convert vector tiles into images.
  • osm-bright-fonts - Fonts used by the osm-bright-style.

Components by MapBox

  • tilelive - ties together various tile sources, both vector and raster
  • tilelive-bridge - generates vector tiles from SQL
  • tilelive-vector - converts vector tiles to raster tiles
  • abaculus - generates raster images of any location and size from a tile source

Other Relevant Components

  • mapnik - Tile rendering library for node
  • leaflet - JavaScript library for mobile-friendly interactive maps

In depth step-by-step:

This documentation assumes that you are going to use osm-bright.tm2 and osm-bright.tm2source for a map style.

Install node.js and npm

Node.js v6 or v8 required; v10+ currently not supported.

For Windows and Mac, downloadable installers can be found at https://nodejs.org/download/release/latest-v6.x/ or https://nodejs.org/download/release/latest-v8.x/.

For Linux, installation via the instructions at https://nodejs.org/en/download/package-manager/ is recommended.

Install other software dependencies

On Ubuntu these can be installed with

sudo apt-get install git unzip curl build-essential sqlite3 pkg-config libcairo2-dev libjpeg-dev libgif-dev libmapnik-dev

Clone the repo and install npm dependencies

git clone https://github.com/kartotherian/kartotherian.git
cd kartotherian
npm install

Source

Set up osm-bright.tm2source as described in its documentation..

osm-bright.tm2source is installed in node_modules/osm-bright-source

Edit Kartotherian configuration - config.yaml

# 0 - one instance, 1+ - multi-instance with autorestart, ncpu - multi-instance, one per CPU
num_workers: 0

# Host port
port: 6533

# Comment out this line to listen to the web
# interface: localhost

# Place all variables (e.g. passwords) here - either as a filename, or as sub-items.
variables:

# Place all sources you want to serve here - either as a filename, or as sub-items.
# See sources.prod.yaml for examples
sources: sources.yaml

Configure Kartotherian

Use one of the config files, or update them, and make a link config.yaml to it.

Add Varnish caching layer (optional)

Might require caching headers added to the source/config.

# From https://www.varnish-cache.org/installation/debian
sudo -Hi
apt-get install apt-transport-https
curl https://repo.varnish-cache.org/GPG-key.txt | apt-key add -
echo "deb https://repo.varnish-cache.org/debian/ jessie varnish-4.0" >> /etc/apt/sources.list.d/varnish-cache.list
apt-get update
apt-get install varnish

vi /etc/varnish/default.vcl

Change default backend to:

backend default {
    .host = "localhost";
    .port = "6533";
}

Add this to vcl_deliver (to track hits/misses):

if (obj.hits > 0) {
    set resp.http.X-Cache = "HIT";
} else {
    set resp.http.X-Cache = "MISS";
}

Edit /etc/systemd/system/varnish.service - set proper listening port (80) and cache size:

ExecStart=/usr/sbin/varnishd -a :80 -T localhost:6082 -f /etc/varnish/default.vcl -S /etc/varnish/secret -s malloc,4g

In bash:

systemctl daemon-reload  # because we changed the .service file
systemctl restart varnish.service
systemctl status varnish.service  # check the service started with the right params
varnishstat  # monitor varnish performance

Run Karthotherian:

npm start

In browser, navigate to http://localhost:6533/.

Troubleshooting

In a lot of cases when there is an issue with node it helps to recreate the node_modules directory:

rm -r node_modules
npm install