Skip to content

Commit

Permalink
Update README.md
Browse files Browse the repository at this point in the history
fixed hyperlinks and headers
  • Loading branch information
timmysiauw authored Apr 18, 2017
1 parent 7c613f8 commit 4ecaa83
Showing 1 changed file with 9 additions and 9 deletions.
18 changes: 9 additions & 9 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ Tools to add maps to your Mode dashboards.
### Context
In the Mode editor, go to 'Report Builder', then to 'Edit HTML'. Here you can add custom HTML, CSS, and javascript to your dashboard. A global variable called ```datasets``` is available to any Javascript function, and it contains the results of all your queries. How your results are stored in this data structure is a little wonky, but the functions in this repo abstract all that away. However, be aware that if your results take up more than 15MB of space, then this object will point to a .csv file instead of as a JSON, and none of these tools will work.

See [here] (https://modeanalytics.com/lyft/reports/81a8d2d0ff81) for examples.
See [here](https://modeanalytics.com/lyft/reports/81a8d2d0ff81) for examples.

### Step 1: Write a Query
Write a query that has a 'lat' and 'lng' column, or a 'geohash' and 'value' column. The columns do not have to be named these, they just have to represent the lat/lng pairs or the geohash/value pairs you want to plot. Run your queries.
Expand Down Expand Up @@ -34,7 +34,7 @@ The inputs are
* ```radius_fun``` A function controlling the radius of plotted point. It should look like ```radius_fun(content, idx)```, where content is the table associated with ```query_name``` and ```idx``` is the index in ```content``` currently being plotted. Note you can call on any column in ```content``` to determine the radius. If ```radius_fun = null``` then the radius is 2px.
* ```color_fun``` A function controlling the color of plotted point. It should look like ```color_fun(content, idx)```, where content is the table associated with ```query_name``` and ```idx``` is the index in ```content``` currently being plotted. Note you can call on any column in ```content``` to determine the color. If ```color_fun = null``` then the color is red.

####Example:
###Example:
```
<div id="test-pts" class="map">
<script>
Expand All @@ -50,7 +50,7 @@ The (new) inputs are
* ```val_col``` The value to be associated with the geohash (usually for coloring)
* ```color_fun``` A function controlling the color of plotted point. It should look like ```color_fun(content, idx)```, where content is table associated with ```query_name``` and ```idx``` is the index in ```content``` currently being plotted. Note you can call on any column in ```content``` to determine the color. If ```null``` then the color is red.

####Example:
###Example:
```
<div id="test-ghs-2" class="map">
<script>
Expand All @@ -64,7 +64,7 @@ For plotting geohashes with a week hour slider, use ```modemap.plot.ghs_w_wkhr_s
The (new) input are
* ```wkhr_col``` The name of the column that should be used for the week hour.

####Example:
###Example:
```
<div id="test-ghs-3" class="map">
<script>
Expand All @@ -73,15 +73,15 @@ The (new) input are
</script>
```

####Geohashes:
###Geohashes:
You can use ```LEFT(f_geohash_encode(lat, lng), 6) AS gh6``` in SQL to get a column of geohash 6's from columns ```lat``` and ```lng```.

You can use ```modemap.geohash.encode(lat, lng)``` and ```modemap.geohash.decode(gh)``` in Javascript to encode and decode geohashes. The ```decode``` function returns an object with properties ```lat```, ```lng```, and ```corners```. Here ```corners``` is the top-left and bottom-right corners of the geohash in the form required by Leaflet to make [rectangles] (http://leafletjs.com/reference-1.0.0.html#rectangle).
You can use ```modemap.geohash.encode(lat, lng)``` and ```modemap.geohash.decode(gh)``` in Javascript to encode and decode geohashes. The ```decode``` function returns an object with properties ```lat```, ```lng```, and ```corners```. Here ```corners``` is the top-left and bottom-right corners of the geohash in the form required by Leaflet to make [rectangles](http://leafletjs.com/reference-1.0.0.html#rectangle).

### Color and Radius Functions
Color and radius functions let you size/color points or color geohashes dynamically based on your SQL results.

####Example:
###Example:
```
<div id="test-pts-2" class="map">
<script>
Expand All @@ -106,13 +106,13 @@ Color and radius functions let you size/color points or color geohashes dynamica
</div>
```

####Built-in Color Functions
###Built-in Color Functions
There are a few color function generators already built in to ```modemap```. More to come!

1. ```modemap.color.fun.constant(color)```: takes a color (hex string) and returns a function that will return that color for all plot markers.
2. ```modemap.color.fun.jet(val_col, min_val, max_val)```: takes the name of a value column in your query results, ```val_col``` and returns a function that will return a color according to [JET](http://matlab.izmiran.ru/help/techdoc/ref/colormap.html) linear color scheme. Values less than ```min_val``` will be assigned the lowest color value (blue) and values higher than ```max_val``` will be assigned the highest color value (red).

####Color Pallettes
###Color Pallettes
You can access some color pallettes using ```modemap.color.palletes```

### Notes:
Expand Down

0 comments on commit 4ecaa83

Please sign in to comment.