From 41f52503ebef1a2d309270abf834c60e1f4860af Mon Sep 17 00:00:00 2001 From: Jon Schleuss Date: Sat, 10 Mar 2018 07:34:38 -0600 Subject: [PATCH 1/4] update readme --- README.md | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/README.md b/README.md index acd403f..1cfd9b2 100644 --- a/README.md +++ b/README.md @@ -8,11 +8,11 @@ |__| |__||_______||_______| |_| |_||__| |__||___| |_| |_||__| |__||___| |_||_______||___| |_| ``` -We make a lot of maps at the Los Angeles Times. So we made this tool to help us make them faster. It uses [Mapzen's Tangram mapping engine](https://mapzen.com/products/tangram/) to render OpenStreetMap and Mapzen data as an image or vector file. +We make a lot of maps at the Los Angeles Times. So we made this tool to help us make them faster. It uses Tangram, which was developed by Mapzen (and tiles are now hosted by Nextzen). The map uses Natural Earth and OpenStreetMap data to export an image or a vector file. -![Fire interrupts Blue and Expo lines](http://www.trbimg.com/img-5979f222/turbine/la-1501164063-xsuwa8dl0a-snap-image/1000) +![#NICAR18](https://user-images.githubusercontent.com/695934/37242701-9ad8c81e-2433-11e8-9ad4-ad2d7646c02f.png) -This tool is still very much a work in progress, so please [give us feedback](https://github.com/datadesk/web-map-maker/issues) if you find something amiss. +We need help making this tool better. If you find bugs, [submit an issue](https://github.com/datadesk/web-map-maker/issues). If you can improve our code, please send us a pull request. ## Live preview @@ -20,22 +20,22 @@ This tool is still very much a work in progress, so please [give us feedback](ht ## Getting started -You don't need much to get up and running. Download this repo and make a config.js file (we provided a template [here](https://github.com/datadesk/web-map-maker/tree/master/js/config.js-TEMPLATE)). You'll also need to create a config.yaml file and leave it in the main directory. +You don't need much to get up and running. Clone this repo and make a config.js file (we provided a template [here](https://github.com/datadesk/web-map-maker/tree/master/js/config.js-TEMPLATE)). You'll also need to create a config.yaml file and leave it in the main directory. -A Bing API key isn't necessary to use the map maker; only for geocoding and location search. You can also define initial coordinates or zoom so you can start the map in your preferred location each time. +A Bing API key isn't necessary to use the map maker; only for geocoding and location search. If you don't have a Bing key you can use coordinates in the location search box. The gutter and columnWidth are the pixel equivelants for the Times' print 6-column layout. -You also need a [Mapzen key](https://mapzen.com/developers/sign_in). That key needs to be placed both in the config.js file and the config.yaml file. +You'll need a (for now) free [Nextzen key](https://developers.nextzen.org/). That key needs to be placed both in the config.js file and the config.yaml file. Your config.js file should look like this: ```js var configOptions = { 'bingAPI': 'Your API here', - 'attribution': 'Your name, ', + 'attribution': 'Your Org name, ', 'initCoords': [34.0425, -118.24], 'initZoom': 14, - 'mapzen-api': 'mapzen-KEYHERE', + 'mapzen-api': 'nextzenKEYHERE', 'columnWidth': 110.45, 'gutterWidth': 12 } @@ -46,7 +46,7 @@ Your config.yaml file should look like this: global: # Sign up for a Mapzen API key to enjoy higher rate limits # https://mapzen.com/documentation/overview/#developer-accounts-and-api-keys - sdk_mapzen_api_key: 'mapzen-KEYHERE' + sdk_mapzen_api_key: 'nextzenKEYHERE' ``` Then you're ready to run the mapmaker. The easiest way is to fire up a simple python server (obviously you'll need python) with this command: @@ -55,7 +55,12 @@ Then you're ready to run the mapmaker. The easiest way is to fire up a simple py python -m SimpleHTTPServer 8000 ``` -The app will be hosted at `localhost:8000` by default. +The app will be hosted at `localhost:8000`. + +## Vector files for print +Because we make maps for web and print, if you select a column size from the drop-down you'll get a map with the column-equivelant for our six-column layout. The vector paths exported from "download vector" can then be converted to CMYK. + +You can then run the `vector-map-restyle.jsx` script in Adobe Illustrator to convert all the layers to values of CMYK. Watch a [tutorial here](http://latimes-graphics-media.s3.amazonaws.com/assets/video/map-maker-script-explainer.mp4). ## What you need to know @@ -63,11 +68,6 @@ Because we've developed this as an internal tool for use at the Los Angeles Time Chrome and Firefox are supported. -## Vector files for print -Because we make maps for web and print, if you select a column size from the drop-down you'll get a map with the column-equivelant for our six-column layout. The vector paths exported from "download vector" can then be converted to CMYK. - -You can then run the `vector-map-restyle.jsx` script in Adobe Illustrator to convert all the layers to values of CMYK. Watch a [tutorial here](http://latimes-graphics-media.s3.amazonaws.com/assets/video/map-maker-script-explainer.mp4). - ## Make this better -Have any ideas? File an issue, fork this repo or contact jon@latimes.com with thoughts, concerns or questions. +Have any ideas? File an issue, fork this repo, send us a pull request or contact jon@latimes.com with thoughts, concerns or questions. From 6e766058eba45c9ebd8d84a3929f6736e475e542 Mon Sep 17 00:00:00 2001 From: Jon Schleuss Date: Sat, 10 Mar 2018 07:51:33 -0600 Subject: [PATCH 2/4] add key --- js/config.js | 8 ++++++++ 1 file changed, 8 insertions(+) create mode 100644 js/config.js diff --git a/js/config.js b/js/config.js new file mode 100644 index 0000000..e63f040 --- /dev/null +++ b/js/config.js @@ -0,0 +1,8 @@ +var configOptions = { + 'bingAPI': '', + 'attribution': '@YOUR ORG, ', + 'initCoords': [34.0425, -118.24], + 'mapzen-api': 'O-JF_PGETeGYMBOx8xd1FA', + 'columnWidth': 110.45, + 'gutterWidth': 12 +} From c19f22f0e9fda3321d2816fc0c9cb93b8f85d6a7 Mon Sep 17 00:00:00 2001 From: Jon Schleuss Date: Sat, 10 Mar 2018 08:04:53 -0600 Subject: [PATCH 3/4] no bing here --- js/config.js | 1 - 1 file changed, 1 deletion(-) diff --git a/js/config.js b/js/config.js index e63f040..b4ddc4b 100644 --- a/js/config.js +++ b/js/config.js @@ -1,5 +1,4 @@ var configOptions = { - 'bingAPI': '', 'attribution': '@YOUR ORG, ', 'initCoords': [34.0425, -118.24], 'mapzen-api': 'O-JF_PGETeGYMBOx8xd1FA', From 1064c1a58ada76674a3a05795f800ba64bad0e41 Mon Sep 17 00:00:00 2001 From: Jon Schleuss Date: Mon, 23 Apr 2018 15:55:48 -0700 Subject: [PATCH 4/4] Delete config.js --- js/config.js | 7 ------- 1 file changed, 7 deletions(-) delete mode 100644 js/config.js diff --git a/js/config.js b/js/config.js deleted file mode 100644 index b4ddc4b..0000000 --- a/js/config.js +++ /dev/null @@ -1,7 +0,0 @@ -var configOptions = { - 'attribution': '@YOUR ORG, ', - 'initCoords': [34.0425, -118.24], - 'mapzen-api': 'O-JF_PGETeGYMBOx8xd1FA', - 'columnWidth': 110.45, - 'gutterWidth': 12 -}