GithubHelp home page GithubHelp logo

static-countries's Introduction

Mapbox Vignettes

Motto: Hay una manera mejor hacer esto en Node.

Point

Someone was interested in an endpoint that allowed you to type in a country name and get back a static image from the Mapbox API, without fiddling around with bounding boxes or centroid coordinates or optimal zoom levels. So this. Who might make use of this? Journalists, Aid workers, and HTML-savvy high school students working on term papers.

Some Examples

Useage

Good lord, it's PHP. I'm very sorry about that. But you build a URL and it spits back an image. Pretty simple. The URL takes the following variables as query strings:

  • name Country name, piece of a country name, whatever
  • mapid Map ID, obtained from your mapbox tileset
  • width Desired image width in pixels
  • height Desired image height in pixels

The URL construction looks like this:

. . ./vignette.php?name=canada&mapid=examples.map-zr0njcqy&width=600&height=400

This will return a 600X400px png image focused on Canada using the tileset "examples.map-zr0njcqy" (which is watermarked; use your own tiles).

Source

You are welcome to use my server endpoint for fiddling/testing. For instance, this:

http://dev.geosprocket.com/mapbox/vignette.php?name=bolivia&mapid=examples.map-zr0njcqy&width=300&height=300

Returns this:

HOWEVER . . . I have not put a lot of juice into this server, so I strongly discourage you from using it in a production environment.

Another Caveat

Web Mercator projection is entirely unsuited to realistically representing polar-leaning countries like Russia, Canada and New Zealand. For that I recommend D3 and a tasty orthographic projection like this

To-Do

  • Add a mask to bring focus to the country in question. More likely with a Canvas-based halo than a vector layer.
  • Beef up the Database to include all levels of admin feature. CartoDB is currently backing this beast.
  • Rewrite in Javascript. I mean, seriously? PHP?

static-countries's People

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.