 It can be that in your pocket or somewhere. It can be in your pocket. Yeah, or in the back of your hand. And then a bit below your beard. Because my skin is like... Okay, so otherwise... I think it's time. On your... I can keep track. The time for you I give you the last 5 minutes of your 20 minutes of presentation. I have 20 minutes? Yes. Okay. I give you the last... I will go back to the last time. Okay. And for the question you repeat the question. Okay, thank you. Right. Thanks everybody. My name is Thiago. Thiago Santos. I work for a company called Mapbox. Pre-introduction. We make maps. And we love open source. Yeah, the name tells it, right? We love open source. We are very excited to be here. And we maintain several popular open source projects like leaflet, open source routing machine. And we also big contributors to OpenStreetMaps. Yeah, like we work with tools like ID and we contribute with data fixing data on OpenStreetMaps and developing tools to improve the quality of the map. But today I'm going to talk about this particular tool. We call it MapboxGL native. It's not exactly a product. We offer is actually the base for our products. We have a map rendering engine SDK for Android, iOS. And it's based on this, what I would say, it's a vector map rendering engine which is open source. And I think it's a very cool bleeding edge technology compared to raster tile rendering engines. I realized when I was making this talk, we don't have a cool logo for this. Many open source software they have. And it was Friday night, our designers, they were sleeping. So I made one. I think they're going to come up with something better Monday. Okay. But what's vector tile? So I was very fortunate because the last talk was awesome. And I was talking about a problem we have with maps. It's huge volume of data. And the satellites, they keep increasing in resolution. I have heard that the army in the US, they have satellites that take resolutions. They can see if you have hair or not. So you want to display this huge amount of data in a computer that is somehow limited by several factors, including memory. So you have to tile the map. Even if you take OpenStreetMap, the sheer amount of data there is like several gigabytes. And you cannot display everything at once and just zoom in in your neighborhood or in your door. And expect that to work. So even vector data, you have to tile. So one strategy we see often, like when you're using leaflet, for instance, you take a big image and you tile. And as you go in, like as you zoom in, you stretch the image. So for a moment, like between the zoom levels, you have an image that doesn't look that great. And then, boom, it gets replaced to a new image and so on. So the nice thing about vector tiles, like if you do the same thing with vector, it works exactly like a SVG. So you can stretch that because it's pretty much saying I have a line from this coordinate to this coordinate. So when you zoom in, you just stretch that. Obviously what defines the resolution is the amount of points you have in between this line. Like if it's a curve, we don't really draw, we don't say like you have a curve like this. We have several points in between that makes a curve. So when you're zooming, you're going to see it turn into something a little bit square. But then it still looks much better than a roster image. So the vector tiles we are rendering here, it's based on an open standard. So it's not, we develop this standard but we keep it open so other vendors, they can implement that. In fact, there are competitors, open source, other open source projects using our vector tile specification. So this technology for rendering these vector tiles like so you can have your beautiful maps in your application. It's not really, let's say, vendor locked in a way that we are making these open source projects so you can use our services. So in fact, you can use, create vector tiles from your own data if you want to. And we also provide open source tools for creating these vector tiles. So for instance, like we have this typical Nu, I still have to learn how to pronounce this. It converts GeoJSON to vector tiles. GeoJSON is fairly established format. So I think one cool application for this, I saw like we have a map for the lectures here and it has a map. So I've seen people using these vector tiles for creating indoor maps like this. We could have just make a map of the university using GeoJSON, convert these to vector tiles and render in the app with completely offline data. I think that's pretty cool. I'm not sure if when we designed this we had this use case in mind but there are some people doing it and I find it really nice. So I think the advantages of rendering your map in the client side are this. Like you can do 3D effects, you can tilt the map. We don't do this in our engine today but we are bringing this toward engine like this native engine. Like you could do 3D extrusions so you can see buildings in your city. The nice thing is when you have a roster image like imagine a picture of myself rotated what's written here in my t-shirt is going to look upside down. Of course but if you have a vector tile and you are rendering a map on the fly client side you have different layers. You know what's a road, what's a building and what's a label. So knowing that your map is rotated you may keep the label upright. It's up to you because we also support styling. So styling meaning you can change colors of your map whatever color you can hide and show features depending on zoom level. You can change that on the fly like if you have a map in an app and you detect that the lightning is weak. You can make your map less brighter so it's less aggressive like if you are looking at night. And also it's more compact compared to PNGs. It's often more compact. That kind of depends on the area you're looking but most of the cases you're going to get better tile size compared to raster tiles. And as I mentioned before you also have a smooth zooming. You don't lose too much resolution when you're zooming into closer to the place you're looking. So this is one example as the map of the university is tilted and is using one style. But just changing one property of the map to style. Boom, you have something completely different without downloading a whole set of raster tiles. It's all done in client side. So if it would be a raster tile it would have to redownload everything. The other thing I find very cool about using vector tiles is you can query features actually. So if you click here you can say give me what is in this area. So the map could give you back like you have a road, you have a building here and the name of the building you have the label here. So you don't need to go to a server and say give me what is at the coordinate x and y. You can do it completely locally also. All right so and about the style it's also open is standard. So specification note is open. It's open for suggestions and again it's not implemented just by us. So back to the engine. We have been doing the development of this engine in the open sources on GitHub. So we brought this engine to different platforms including Linux, Mac, iOS, Android. And most recently we contribute this engine to the Qt project. It's an established C++ open source framework. So it was very interesting to work with the Qt company. We're still working with them. And so you can use what they call QML. It's a language for describing user interfaces. It's very easy. It's way better compared to something like HTML. I think it's the last time I do a talk using a HTML slideshow. It's horrible to make this. Really like put this image, a line in the center here took me 30 minutes. Anyway, so we have our engine on Qt now. It's going to be there by default from Qt 5.9 which is the upcoming release for this year. And you could do in the future something just like this, like window. You change the string to MapboxGL here. Put some coordinates if you're familiar with QML. This code, it's a bit simplified here but with six more lines of code. This is enough to have a window with a map centered at a coordinate. This is in Oslo at Zoom level 10. QML is pretty cool. It's very easy to read. With Qt, you can get the same map on your phone, on desktop. And we are trying to get this running on Windows today because we don't support Windows at the moment. But with Qt, we saw maybe a window, hope not intended for that. So what about a new platform? Because the idea, one of the ideas you have this talk is like to invite developers to get vector maps, better maps in other platforms. Like I know that GNOME is using our raster ties. But I would love to see, I don't know, GNOME maps maybe using vector ties. I don't see why not. We brought this to Qt, so competition is on. So what do you need for having this engine running in your whatever framework you have? Let's say I'm using GTK here as an example, but you need a decent C++ for a team compiler. We use some features and it's not every compiler that can do it. For instance, clang, recent versions of clang can do it fine. But GCC, you need GCC 5.0. We had some issues with customers using GCC 4.9 and complaining about GCC 5.0 is too new, even though I think it's three years old. So we are bringing it back to GCC 4.9. Maybe Devin's using 4.9, I don't know. Apart from that, you need OpenGL. We rely on OpenGL, it could be OpenGL ES if your platform supports that. And you need to do a little bit of plumbing, because the engine is designed in a way that you have the core of the engine and you have the platform bindings. So you can plug your platform. For example, we did some experiments and we got this running on the Unity 3D SDK by just replacing this part. So you need some main loop. Like if you're porting this to GTK, I think GLIB gives you that. You need some thread, IPC. Again, like GLIB gives you that. I know there is this GA-SYNC message or something like that. And you need a network stack. It sounds big, but we have in our engine some implementations of portable network stacks. For instance, we have already libcurl implemented. So if you're using porting to GTK, you can just keep using the libcurl implementation. It's going to probably work on all Linux platforms. And if you don't have a main loop or a thread IPC, we have this implemented for you already, this libUV. I don't know if you have heard about libUV. It's the main loop implementation that Node.js is using. In fact, I look it up because I've been calling this libUV, libUltraViolet for a while, because I don't know, UV. But in fact, it stands for Unicorn Velociraptor, which is a very interesting name. We wrote, I will talk more if I have more time about the details of porting this to a new platform, a bit short on time. So we wrote a blog post about describing the details. And again, we are doing the development in the open. So we have, I'm usually hanging out on Slack channels, IRC channels, especially on the Qt Mobility IRC at FreeNode. So I invite everyone to help us. I would, especially the GTK guys, if there is anyone here doing GTK to join us. So thank you. And if you have any questions, please. So about porting. When we ported to Qt, was it a port of the Mapoq scale-lengthed model, or was it a rewrite to fit into Qt? Was it a linking to what? Did you link with the Mapoq scale? We write it in Qt. Yeah, so when we ported this to Qt, was the core of the engine, this 100% C++, like portable, we didn't have to change that. We rewrote the platform adaptations to work with Qt main loop and the Qt network stack. And now Qt is going to ship our engine inside the Qt SDK. So it's there. So we are making a release for Qt. And if you download the Qt SDK 5.9, you're going to get this engine included for free. They want to deploy the engines when they're on somewhere. Should I have a big CPU or GPU or a chance hard drive? OK, so the question, sorry if I forgot to repeat the other one, but it's about the platform requirements. Please repeat the question. Yeah, so the question was about platform requirements. So the cheapest hardware I managed to get this running with decent performance was the latest Raspberry Pi. Raspberry Pi, the board. Yeah, you need a GPU. Yeah, you need a GPU, but you can also, if you want to rasterize things using our engine server side, it's also possible. You can use this Mesa software rasterizer, but it's going to be a bit slow, but it works. We do that because we have, you do for running unit tests and stuff like that. We know it works. Any more questions? OK, if not, thank you for your time. And I will be hanging out here if you have any more questions. Do you have another table for that to save my life? Just a little bit, because I have 80% and can I still you while 15 minutes? Great, but after we have people explain. Yeah, I am. In fact, it's in my bag and it's 20 minutes I'm looking for in my bag. It's perfect. Always I pull out my pajamas from my bag. Perfect. And it's right here. Nothing inside. Nothing dangerous. I scan everything and I collect everything. I'm putting more of that on the table. Thank you. I'm safe. What do you like to do? Why don't you use IoT to detect the cable in your bag? I will make a break after the presentation starts. Oh, it's OK. And then we were planning with Mady to be run for before the presentation. OK, that's good.