Created
December 27, 2012 22:36
-
-
Save wboykinm/4392734 to your computer and use it in GitHub Desktop.
figuring out cartodb.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Status #cartodbX | |
[CartoDB: look to the future, leave the past behind] | |
[10:58] == wboykinm [47e96f6f@gateway/web/freenode/ip.71.233.111.111] has joined #cartodb | |
[11:19] == jatorre_ [~jatorre@9.Red-95-120-122.dynamicIP.rima-tde.net] has joined #cartodb | |
[11:20] == jatorre [~jatorre@12.241.216.87.static.jazztel.es] has quit [Ping timeout: 255 seconds] | |
[11:20] == jatorre_ has changed nick to jatorre | |
[12:09] <wboykinm> andrewxhill: I still have to demo a few items, but do you have 5minutes later today for a cartodb.js strategy question? | |
[12:10] <wboykinm> andrewxhill: though I'm sure you're already loving the influx of support Qs in the past week | |
[12:10] <andrewxhill> :) | |
[12:10] <andrewxhill> yeah, ping me and i can try and help out | |
[12:11] <andrewxhill> or maybe we'll learn together | |
[12:11] <wboykinm> andrewxhill: cool; just need to hit a dead-end on tooltips first :) | |
[12:48] <wboykinm> andrewxhill: Are you around a screen at 2PM NYC time? | |
[12:51] <wboykinm> andrewxhill: I'll give a shout then. | |
[12:52] <jatorre> hey, anybody knows if it is possible to do an INSERT only if a condition is met? | |
[14:08] <wboykinm> andrewxhill: Is it a good moment for the aforementioned context question? | |
[14:08] <andrewxhill> hey wbokinm | |
[14:08] <andrewxhill> here now yeah | |
[14:08] <wboykinm> andrewxhill: awesome. thanks | |
[14:09] <wboykinm> so I've been fiddling around the edges of what I see as the 3 cartodb delivery vehicles: | |
[14:09] <wboykinm> SQL API | |
[14:09] <wboykinm> tiled maps api | |
[14:09] <wboykinm> viz.json | |
[14:09] <andrewxhill> ok | |
[14:09] <wboykinm> And I'm trying to figure out which one best suits my current project | |
[14:10] <wboykinm> this sucker: http://bl.ocks.org/d/4390299/ | |
[14:10] <wboykinm> which is getting a bit big to be living in a gist | |
[14:10] <andrewxhill> ha, k | |
[14:10] <wboykinm> but that aside, I have basically one cartodb table per nav | |
[14:11] <wboykinm> and each dropdown option styles the layer on a different column | |
[14:11] <wboykinm> the only one working right now it the "types" nav | |
[14:11] <wboykinm> and I also need to be able to style the popup template w/ html | |
[14:12] <wboykinm> andrewxhill: the current site is using the viz.json method w/ SQL selectors, and I don't think that's sufficiently flexible for the above bullet points. | |
[14:13] <wboykinm> andrewxhill: Is there a recommended API to use for this sort of application? | |
[14:13] <wboykinm> Once I have that figured out I'll keep building out the site | |
[14:13] <andrewxhill> right | |
[14:13] <andrewxhill> so let me look real quick | |
[14:13] <wboykinm> andrewxhill: codeness: http://bl.ocks.org/4390299 | |
[14:15] <andrewxhill> yes, i think the viz.json seems suited for this | |
[14:15] <andrewxhill> where are you having difficulty? | |
[14:15] <wboykinm> andrewxhill: 1.) passing style params w/ each switch | |
[14:16] <wboykinm> 2.) switching between tables/viz.json feeds | |
[14:16] <andrewxhill> http://developers.cartodb.com/documentation/cartodb-js.html#sec-6-8 | |
[14:16] <andrewxhill> so | |
[14:16] <andrewxhill> for switching styles | |
[14:16] <andrewxhill> you should use that link | |
[14:16] <andrewxhill> http://developers.cartodb.com/documentation/cartodb-js.html#sec-6-8 | |
[14:16] <wboykinm> 3.) getting the popup script to override the viz popups | |
[14:17] <andrewxhill> for each table though, you should create manage a different layer | |
[14:17] <andrewxhill> so cartodb.createLayer(... | |
[14:17] <andrewxhill> for each one | |
[14:17] <andrewxhill> then manage the layers | |
[14:17] <andrewxhill> so using | |
[14:17] <andrewxhill> http://developers.cartodb.com/documentation/cartodb-js.html#sec-6-2 | |
[14:17] <andrewxhill> show and hide | |
[14:17] <andrewxhill> you will toggle them on and off of the map | |
[14:17] <andrewxhill> instead of swapping the viz.json after the fact | |
[14:18] <wboykinm> andrewxhill: any idea if that encourages caching? | |
[14:18] <wboykinm> i've got a low-bandwidth target audience | |
[14:18] <andrewxhill> local caching, i'm not sure it will make it any better or worse | |
[14:19] <wboykinm> andrewxhill: no big worry on that, since it's light-years ahead of the ArcGIS flash monstrosity they were using before anyway | |
[14:19] <andrewxhill> i'm sure | |
[14:21] <wboykinm> andrewxhill: okay, so the viz.json is okay for these purposes . . . | |
[14:22] <wboykinm> andrewxhill: can you tell why the popup script isn't overriding the viz popups? | |
[14:23] <andrewxhill> hmm | |
[14:23] <andrewxhill> let me look | |
[14:26] <andrewxhill> layer.infowindow.set('template', $('#infowindow_template').html()); | |
[14:26] <andrewxhill> well | |
[14:26] <andrewxhill> no | |
[14:26] <andrewxhill> that is right | |
[14:26] <andrewxhill> you need that line | |
[14:26] <andrewxhill> https://github.com/CartoDB/cartodb.js/blob/develop/examples/custom_infowinfow.html#L60 | |
[14:27] <wboykinm> oy. the basics. | |
[14:27] <wboykinm> i'll figure out where to call that then. | |
[14:27] <wboykinm> hey, thanks! Good to know I'm on approximately the right track! | |
[14:27] <andrewxhill> createSelector(layers[1]) | |
[14:27] <andrewxhill> right after you call that | |
[14:28] <wboykinm> ah, not baselayer. | |
[14:28] <andrewxhill> layer[1].infowindow.set('template', $('#infowindow_template').html()); | |
[14:28] <wboykinm> oh, that beggars the question: | |
[14:28] <wboykinm> following one of these variable-laden calls, how would I tack another tileLayer on top of what's loaded? | |
[14:29] <wboykinm> andrewxhill: i.e. like this: http://bl.ocks.org/4235778 | |
[14:29] <wboykinm> it seems different when using the viz.json | |
[14:32] <jatorre> hey wboykinm | |
[14:33] <jatorre> do you mind if we include some of your examples on cartodb.js? | |
[14:33] <jatorre> they are quite cool | |
[14:33] <andrewxhill> sooo | |
[14:33] <andrewxhill> i think you can get map out of the returned vis | |
[14:33] <andrewxhill> vis.map? | |
[14:33] <andrewxhill> and then vis.map.addLayer(...) | |
[14:33] <andrewxhill> to add another layer | |
[14:33] <andrewxhill> let me try one thing first though | |
[14:42] <andrewxhill> yeah | |
[14:42] <andrewxhill> so looking at it now | |
[14:42] <andrewxhill> santana might be able to tell you better | |
[14:42] <andrewxhill> but I would use the createLayer method | |
[14:42] <andrewxhill> not the create viz | |
[14:43] <andrewxhill> in this example | |
[14:45] <andrewxhill> there is another option | |
[14:46] <andrewxhill> inside the createLayer().done() function | |
[14:46] <andrewxhill> you are using | |
[14:46] <andrewxhill> it returns vis, layers | |
[14:46] <andrewxhill> you can get the map object from vis, like this, | |
[14:46] <andrewxhill> mm = vis.getNativeMap(); | |
[14:46] <andrewxhill> mm is now your native map | |
[14:46] <andrewxhill> from which you can add more layers | |
[14:46] <andrewxhill> cartodb.createLayer(mm, second_layer | |
[14:47] <andrewxhill> but let me test that out real quick | |
[14:52] == jatorre [~jatorre@9.Red-95-120-122.dynamicIP.rima-tde.net] has quit [Quit: jatorre] | |
[14:59] <wboykinm> andrewxhill: just checking, does "mm" refer to modest maps? | |
[14:59] <andrewxhill> no no | |
[14:59] <andrewxhill> sorry | |
[14:59] <andrewxhill> that method isn't working for me anyway | |
[14:59] <andrewxhill> i'm testing here | |
[15:00] <andrewxhill> map | |
[15:00] <andrewxhill> if you create it on your own | |
[15:00] <andrewxhill> with gmaps or leaflet | |
[15:00] <andrewxhill> if you use createVis | |
[15:00] <andrewxhill> inside the done function | |
[15:00] <andrewxhill> you can use, map = vis.getNativeMap(); | |
[15:00] <andrewxhill> to get the same map object AFTER the map is created | |
[15:00] <andrewxhill> but i think the way you want to do this vis | |
[15:01] <andrewxhill> is with createLayer | |
[15:01] <andrewxhill> anyway | |
[15:01] <wboykinm> andrewxhill: FWIW I'm avodoiding google's API at all costs | |
[15:02] <andrewxhill> totally | |
[15:02] <wboykinm> andrewxhill: Not to throw a wrench in the gears, but would lvector.Cartodb() work? | |
[15:02] <wboykinm> andrewxhill: http://geojason.info/leaflet-vector-layers/demos/cartodb/ | |
[15:03] <andrewxhill> not sure | |
[15:03] <andrewxhill> i haven't messed with it | |
[15:03] <andrewxhill> give me 5 min | |
[15:03] <andrewxhill> i can get you an example of what i'm talking about | |
[15:06] <wboykinm> andrewxhill: coolness. thanks again. | |
[15:12] <andrewxhill> http://bl.ocks.org/4391555 | |
[15:12] <andrewxhill> i added a stupid body.click listener | |
[15:13] <andrewxhill> so you can see the second layer get toggled on/off | |
[15:13] <andrewxhill> just click anywhere | |
[15:13] <andrewxhill> there are better ways to manage them | |
[15:13] <andrewxhill> i just wanted to demonstrate quickly | |
[15:15] <wboykinm> andrewxhill: oh cool | |
[15:16] <wboykinm> it'll take me a bit to sort out the body.click thing, but i get the cartodb.createLayer | |
[15:16] <wboykinm> andrewxhill: props to you for mining out my 3-layer mapbox composite URL :) | |
[15:17] <andrewxhill> :) | |
[15:18] <wboykinm> andrewxhill: where would I shoehorn in layer.setCartoCSS? | |
[15:18] <wboykinm> andrewxhill: after createSelector? | |
[15:18] <andrewxhill> yup | |
[15:18] <andrewxhill> or like the second layer | |
[15:18] <andrewxhill> you can pass it at creation | |
[15:19] <wboykinm> andrewxhill: ha! | |
[15:20] <wboykinm> just saw it; the code didn't wrap | |
[15:20] <wboykinm> that's perfect | |
[15:20] <andrewxhill> great | |
[15:20] <wboykinm> andrewxhill: thanks, man | |
[15:20] <andrewxhill> hey | |
[15:20] <andrewxhill> so | |
[15:20] <wboykinm> i greatly appreciate the help | |
[15:20] <andrewxhill> can we link to one of your maps with cartodb.js | |
[15:20] <andrewxhill> in our blog post? | |
[15:21] <wboykinm> sure; can you hold for a week? i'll be delivering to the client for final approval | |
[15:21] <andrewxhill> hmm | |
[15:21] <andrewxhill> our post is going up today | |
[15:21] <wboykinm> any of the intermediate tweaks are fair game though | |
[15:21] <andrewxhill> so next time | |
[15:21] <wboykinm> just don't call it "MECMaps, funded by USAID" | |
[15:21] <wboykinm> yet | |
[15:22] <andrewxhill> ha | |
[15:22] <andrewxhill> which is a good url? | |
[15:48] <andrewxhill> wboykinm: was there a good url to link to? | |
[16:10] <wboykinm> andrewxhill: sorry about that; had to duck out | |
[16:10] <andrewxhill> noooo prob | |
[16:10] <wboykinm> andrewxhill: what sort of functionality do you want to focus on? | |
[16:10] <andrewxhill> we are just making a release announcement for cartodb.js | |
[16:11] <andrewxhill> we want to say something like, 'some users have already begun testing it out...' | |
[16:11] <andrewxhill> and in text i'd link to one of your maps | |
[16:13] <wboykinm> andrewxhill: coolio | |
[16:13] <wboykinm> andrewxhill: this is approved content, but not far from Santana's rambo example: http://btvvotes.geosprocket.org/demography/8wards.html | |
[16:14] <andrewxhill> perfect | |
[16:14] <andrewxhill> ! | |
[16:14] <andrewxhill> thanks | |
[16:21] <wboykinm> andrewxhill: also, markers + bootstrap SQL selector: | |
[16:21] <wboykinm> andrewxhill: http://dev.geosprocket.com/templates/cartodb-marker-file/ | |
[16:22] <wboykinm> andrewxhill: This will all be open in short order, and that's just a snippet. | |
[16:35] == jherencia [~jherencia@136.172.216.87.static.jazztel.es] has quit [Remote host closed the connection] | |
[16:51] <wboykinm> andrewxhill: I see why @jatorre had his head down. That's a long post :) | |
[17:01] <andrewxhill> ha | |
[17:01] <andrewxhill> i wrote it | |
[17:02] <andrewxhill> take full credit for any spanishisms | |
[17:03] <wboykinm> andrewxhill: hey, right on. | |
[17:03] <andrewxhill> :) | |
[17:04] <wboykinm> andrewxhill: how did you run into a bunch of Madridniks in the first place? | |
[17:04] <andrewxhill> was throwing a workshop with my advisor on mapping and data viz | |
[17:04] <andrewxhill> and invited vizzuality and gbif | |
[17:05] <andrewxhill> met javi and tim robertson | |
[17:05] <andrewxhill> and then started hacking on some side projects with them | |
[17:05] <andrewxhill> the rest is history | |
[17:05] <wboykinm> awesome. You guys do good work. | |
[17:05] <andrewxhill> thanks dude | |
[17:20] <wboykinm> andrewxhill: last hit of the day: is there a built-in way to pass a column name into the "tile_style" params? | |
[17:20] <wboykinm> andrewxhill: I notice there seems to be a default for the {{table_name}} | |
[17:20] <andrewxhill> right | |
[17:20] <andrewxhill> nothing for column_name | |
[17:20] <andrewxhill> no | |
[17:22] <wboykinm> andrewxhill: Any chance variables would work the same way as with the popups? | |
[17:22] <wboykinm> andrewxhill: i.e. {{content.data.libelle}} | |
[17:22] <andrewxhill> nothing that i know of like this | |
[17:23] <andrewxhill> this one is def better in the santana domain | |
[17:23] <wboykinm> andrewxhill: Okay, I'll check w/ him. | |
[17:23] <wboykinm> andrewxhill: I've already got the var defined, so I figure it can't be impossible | |
[17:23] <wboykinm> "var crop = $li.attr('data');" | |
@ChanServ | |
agoddard_ | |
andrewxhill | |
Brandonian | |
jeremyb | |
lossyrob | |
strk | |
wboykinm | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment