{"id":2868,"date":"2019-08-22T16:34:20","date_gmt":"2019-08-22T16:34:20","guid":{"rendered":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/"},"modified":"2021-11-29T21:42:55","modified_gmt":"2021-11-29T21:42:55","slug":"using-traffic-data-with-maps-and-routes","status":"publish","type":"post","link":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/","title":{"rendered":"Using Traffic Data with Maps and Routes"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"2868\" class=\"elementor elementor-2868\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-36284a31 elementor-section-boxed elementor-section-height-default elementor-section-height-default qodef-elementor-content-no\" data-id=\"36284a31\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-555a51ba\" data-id=\"555a51ba\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c38f377 elementor-widget elementor-widget-text-editor\" data-id=\"c38f377\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\/*! elementor - v3.21.0 - 25-04-2024 *\/\n.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:#69727d;color:#fff}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap{color:#69727d;border:3px solid;background-color:transparent}.elementor-widget-text-editor:not(.elementor-drop-cap-view-default) .elementor-drop-cap{margin-top:8px}.elementor-widget-text-editor:not(.elementor-drop-cap-view-default) .elementor-drop-cap-letter{width:1em;height:1em}.elementor-widget-text-editor .elementor-drop-cap{float:left;text-align:center;line-height:1;font-size:50px}.elementor-widget-text-editor .elementor-drop-cap-letter{display:inline-block}<\/style>\t\t\t\t<p>With TomTom Live Traffic, traffic is continuously monitored to provide the most up-to-date information about traffic flow and traffic incidents. The traffic incident information includes the location, duration, and severity of traffic jams, accidents, road work, road closures and weather-related issues. The traffic flow information includes average speed and travel times for both current and ideal conditions.<\/p><p>In this article we will:<\/p><ul style=\"font-size: 16px; background-color: #ffffff;\"><li style=\"font-size: 16px;\">Take a look at the kinds of traffic information available through TomTom APIs<\/li><li style=\"font-size: 16px;\">Review how TomTom provides map information to display routes and traffic<\/li><li style=\"font-size: 16px;\">Explore traffic data available through TomTom map and routing APIs<\/li><\/ul><h2>Visualizing traffic information<\/h2><p>TomTom collects and seamlessly aggregates a wealth of traffic information. This information covers over 65 countries and is collected from over 500 million devices, with data sources including anonymized data from GPS devices, mobile phone signals, and sensors.<\/p><p>TomTom offers a suite of tools that allow developers to easily provide users with stunning visualizations to see delays and the location and severity of incidents at a glance. This same information is analyzed to provide intelligent routing decisions to help users avoid delays when traveling from A to B. Traffic data is also used to calculate travel times and ranges.<\/p><p>TomTom provides a robust set of APIs for visualizing traffic flow and traffic incident information. To understand how these services work together, we first need to quickly review how a map tiling system functions.<\/p><h2>Working with tiles and layers<\/h2><p>When TomTom displays a map, it retrieves the map in equal-sized \u201cchunks\u201d called tiles. Let\u2019s consider the San Francisco region. \u202fIf we view a map of this area returned by the TomTom map API, we might see something like the following.<\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325658107_2872b7d126_o.png\" alt=\"maptraffic1\" \/><\/p><p>At this zoom level, the previous map actually consists of four separate tiles that are joined together. If we were to slightly separate each of these tiles, we could see the where tile boundaries lay.<\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325660227_eae40ed3cd_o.png\" alt=\"MapsTraffic2\" \/><\/p><p>Let\u2019s consider a single tile: the tile in the upper left corner of the previous map. This tile helps the user to visualize basic map information. There are other tiles, for this same location, that help to visualize different information (e.g. traffic flow). These visualizations can be layered together to provide a more nuanced view.<\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325529761_b01e39f834_o.png\" alt=\"MapsTraffic3\" \/><\/p><p>Above, we can see the different layers that are available. On their own, they can be a bit sparse. When combined, they allow the user to visualize a wealth of information quickly.<\/p><p>Each of the layers, except for the basic map layer, includes areas of the image that are transparent. This allows each of the layers to be stacked on top of each other, producing the image to the right.<\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325659852_8d58a19141_o.png\" alt=\"MapsTraffic4\" \/><\/p><p>An astute observer may notice that labels appear both in the basic map layer and the labels layer. The repetition is necessary. When traffic flow or traffic incidents are laid on top of the basic map, they may occlude some of the labels. This is the case following step 2 (below). The availability of the labels layer allows us to restore the occluded labels in step 3.<\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325529526_89a05bbaf1_o.png\" alt=\"MapsTraffic5\" \/><\/p><h2>Increasing the details<\/h2><p>With maps, the zoom level affects the level of detail that is displayed. As the zoom level increases in the following series of maps, notice how the amount of information displayed also increases.<\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325529421_f9f7999fd6_o.png\" alt=\"Mapstraffic6\" \/><\/p><p>When far out, there are only hints of traffic issues in San Francisco. At the end of the series, the level of detail allows the user to see individual streets experiencing traffic issues.<\/p><h2>Map tiles<\/h2><p>Requesting raster tiles from the API is relatively simple. There is a high degree of similarity in the format of the required elements of the URLs for both the Maps and Traffic APIs. In each case, the format is as follows:<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ab9adb7 elementor-widget elementor-widget-code-highlight\" data-id=\"ab9adb7\" data-element_type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-javascript line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-javascript\">\n\t\t\t\t\t<xmp>http(s):\/\/baseURL\/service\/versionNumber\/tile\/type\/style\/zoom\/X\/Y.format?key=API_Key<\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4acf775 elementor-widget elementor-widget-text-editor\" data-id=\"4acf775\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>For example, to request each of the possible layers for the San Francisco area, the correct URLs would be as follows (with your actual TomTom API key substituted for the text \u201cAPI_Key\u201d):<\/p><p><img decoding=\"async\" style=\"max-width: 315px;\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325659627_293fefbebb_o.png\" alt=\"Mapstraffic7\" \/><\/p><p><span style=\"font-weight: bolder;\">Basic<\/span>:\u00a0<a href=\"https:\/\/api.tomtom.com\/map\/1\/tile\/basic\/main\/10\/163\/395.png?key=\">https:\/\/api.tomtom.com\/map\/1\/tile\/basic\/main\/10\/163\/395.png?key=<\/a><\/p><p><img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325529101_e0d88a1d60_o-300x300.png\" alt=\"\" width=\"300\" height=\"300\" \/><\/p><p><span style=\"font-weight: bolder;\">Hybrid:<\/span>\u00a0<a href=\"https:\/\/api.tomtom.com\/map\/1\/tile\/hybrid\/main\/10\/163\/395.png?key=API_Key\">https:\/\/api.tomtom.com\/map\/1\/tile\/hybrid\/main\/10\/163\/395.png?key=API_Key<\/a><\/p><p><img decoding=\"async\" style=\"max-width: 315px;\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325528871_fe8fe3699f_o-1.png\" alt=\"mapstraffic9\" \/><\/p><p><span style=\"font-weight: bolder;\">Labels:<\/span>\u00a0<a href=\"https:\/\/api.tomtom.com\/map\/1\/tile\/labels\/main\/10\/163\/395.png?key=API_Key\">https:\/\/api.tomtom.com\/map\/1\/tile\/labels\/main\/10\/163\/395.png?key=API_Key<\/a><\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325659052_defb950376_o-300x300.png\" alt=\"\" width=\"300\" height=\"300\" \/><\/p><p><span style=\"font-weight: bolder;\">Incidents:<\/span>\u00a0<a href=\"https:\/\/api.tomtom.com\/traffic\/map\/4\/tile\/incidents\/s3\/10\/163\/395.png?key=API_Key\">https:\/\/api.tomtom.com\/traffic\/map\/4\/tile\/incidents\/s3\/10\/163\/395.png?key=API_Key<\/a><\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658947_aee95f6e13_o-300x300.png\" alt=\"\" width=\"300\" height=\"300\" \/><\/p><p><span style=\"font-weight: bolder;\">Flow<\/span>:\u00a0<a href=\"https:\/\/api.tomtom.com\/traffic\/map\/4\/tile\/flow\/absolute\/10\/163\/395.png?key=API_Key\">https:\/\/api.tomtom.com\/traffic\/map\/4\/tile\/flow\/absolute\/10\/163\/395.png?key=API_Key<\/a><\/p><h2>Vector Tiles<\/h2><p>The TomTom API also provides the capability to request vector tiles. Instead of providing a pre-drawn image, these tiles (essentially) provide instructions for drawing the image yourself. The URLs for requesting these files are nearly identical to those used when requesting a raster tile.<\/p><h2>Advantages of Using an SDK<\/h2><p>While the APIs get you the information that you need, they do not address the complexities of a user interface. Thankfully, in addition to the APIs described in this article,\u00a0<a href=\"https:\/\/contentlab.com\/adding-ev-routing-to-a-tomtom-web-map-building-the-web-application\/\">TomTom<\/a>\u00a0also provides excellent Software Development Kits (SDKs) for a number of platforms (Web,\u00a0<a href=\"https:\/\/contentlab.com\/android-project-setup-for-the-tomtom-maps-sdk-2\/\">Android<\/a>, and iOS).<\/p><p>In addition to simplifying user interfaces, these SDKs shield the developer from many of the following complexities:<\/p><ul style=\"font-size: 16px; background-color: #ffffff;\"><li style=\"font-size: 16px;\">Compositing of multiple tile layers into a single tile image.<\/li><li style=\"font-size: 16px;\">Assembling multiple nearby tiles into a single coherent map.<\/li><li style=\"font-size: 16px;\">Overlaying additional information (e.g. markers).<\/li><li style=\"font-size: 16px;\">Transforming coordinates between multiple coordinate systems: EPSG 3857 (web Mercator), EPS 4326 (latitude\/longitude), tile coordinates (when requesting tiles), and pixel coordinates (when displaying information).<\/li><li style=\"font-size: 16px;\">Rendering (or displaying) vector tiles.<br \/><br \/><\/li><\/ul><p>For example, assuming you\u2019ve previously downloaded the TomTom Web SDK and placed it in the same directory, this is the entirety of the source code required to show a map of San Francisco including traffic flow and traffic incident layers (with your actual TomTom API key substituted for the text \u201cAPI_Key\u201d):<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d8c70d7 elementor-widget elementor-widget-code-highlight\" data-id=\"d8c70d7\" data-element_type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-html line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-html\">\n\t\t\t\t\t<xmp><!DOCTYPE html>\r\n<html>\r\n <head>\r\n   <link rel='stylesheet' type='text\/css' href='sdk\/map.css'\/>\r\n   <script src='sdk\/tomtom.min.js'><\/script>\r\n   <style> #map { height: 512px; width: 512px; }<\/style>\r\n <\/head>\r\n \r\n <body>\r\n   <div id='map'><\/div>\r\n   <script>\r\n     var key = 'API_Key'; \r\n     var map = tomtom.L.map('map', { key:key, center: [37.81005, -122.41773], zoom: 9 })\r\n      .addLayer(new L.TomTomTrafficFlowLayer({key:key}))\r\n      .addLayer(new L.TomTomTrafficIncidentsLayer({key:key}));\r\n   <\/script>\r\n <\/body>\r\n<\/html><\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-663541d elementor-widget elementor-widget-text-editor\" data-id=\"663541d\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<h2>Traffic Details<\/h2><p>While the TomTom API provides exceptional visualizations, sometimes you may need to dig even deeper. Thankfully, the API provides traffic information in the JSON or XML format, with even greater levels of detail than what is possible in a visualization.<\/p><p>Let\u2019s consider the following map from the Boston, Massachusetts area, where we are including the Basic, Traffic Incident, and Labels layers. The Traffic Flow layer is omitted to help us better focus on traffic Incidents.<\/p><p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5075\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658782_ca1c8c8a2c_o.png\" alt=\"\" width=\"1000\" height=\"1000\" srcset=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658782_ca1c8c8a2c_o.png 1000w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658782_ca1c8c8a2c_o-300x300.png 300w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658782_ca1c8c8a2c_o-150x150.png 150w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658782_ca1c8c8a2c_o-768x768.png 768w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658782_ca1c8c8a2c_o-650x650.png 650w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658782_ca1c8c8a2c_o-120x120.png 120w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/p><p>When we examine this map, we\u2019ll notice the traffic incidents displayed as arrows in four different colors. The head of the arrow indicates the end of the incident and its opposite side indicates the beginning of the incident. The color coding is as follows:<\/p><p><img decoding=\"async\" style=\"width: unset;\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325528191_458a2dd374_o.png\" alt=\"mapstraffic13\" \/>Unknown (0) or Undefined (4) \u2013 the delay caused by this incident is unknown or indefinite.<\/p><p><img decoding=\"async\" style=\"width: unset;\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325658572_438bd446f6_o.png\" alt=\"mapstraffic14\" \/>\u00a0Minor (1) \u2013 the delay caused by this incident is minor.<\/p><p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5076\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325528151_98d0e35d2e_o.png\" alt=\"\" width=\"77\" height=\"43\" \/>\u00a0Moderate (2) \u2013 the delay caused by this incident is moderate.<\/p><p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5077\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325528101_bd15b9de40_o.png\" alt=\"\" width=\"77\" height=\"43\" \/>Major (3) \u2013 the delay caused by this incident is major.<\/p><p>The previous map still presents a little bit too much information for us to dig deeper. From here on, we\u2019ll focus on the following single tile from the upper left corner of the previous map.<\/p><p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-5078\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658512_ac575448e7_o-300x300.png\" alt=\"\" width=\"300\" height=\"300\" srcset=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658512_ac575448e7_o-300x300.png 300w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658512_ac575448e7_o-150x150.png 150w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658512_ac575448e7_o-768x768.png 768w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658512_ac575448e7_o-650x650.png 650w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658512_ac575448e7_o-120x120.png 120w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325658512_ac575448e7_o.png 1000w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/p><p>In this tile, there are three traffic incidents: one is south of Derry and the other three are clustered near Andover. By requesting the incident detail from the Traffic API, we can find out more information about these incidents.<\/p><p>If there were no incidents in the region, the JSON response from the API would look as follows.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-73da25c elementor-widget elementor-widget-code-highlight\" data-id=\"73da25c\" data-element_type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-json line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-json\">\n\t\t\t\t\t<xmp>{\r\n \"tm\": {\r\n  \"@id\": \"1557529120\",\r\n  \"poi\": []\r\n }\r\n}<\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a627851 elementor-widget elementor-widget-text-editor\" data-id=\"a627851\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>If a traffic incident had occurred, it would appear as a JSON object within the \u201cpoi\u201d array and be similar to the following:<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-07423e7 elementor-widget elementor-widget-code-highlight\" data-id=\"07423e7\" data-element_type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-json line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-json\">\n\t\t\t\t\t<xmp>{ \r\n  \"id\": \"TTR81926518760064\",\r\n  \"p\": { \"x\": -7940794.9168659, \"y\": 5289584.3967859 },\r\n \"op\": { \"x\": -7940447.5022704, \"y\": 5290596.5511616 },\r\n \"ic\": 9,\r\n \"ty\": 0,\r\n \"cs\": 0,\r\n \"d\": \"roadworks\",\r\n \"c\": \"new roadworks layout\",\r\n \"f\": \"NH-102\/Nashua Rd\/Exit 4 (I-93)\",\r\n \"t\": \"NH-111\/Indian Rock Rd\/Exit 3 (I-93)\",\r\n \"l\": 6282,\r\n \"r\": \"I-93\"\r\n}<\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ea74849 elementor-widget elementor-widget-text-editor\" data-id=\"ea74849\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>Here, we see that road work is occurring to implement a new road work layout. The road work is occurring on route I-93 from NH-102\/Nashua Rd\/Exit 4 (I-93) to NH-111\/Indian Rock Rd\/Exit 3 (I-93).<\/p><h2>Traffic flow details<\/h2><p>The Traffic API also allows developers to request traffic flow detail for any road segment. Let\u2019s consider the following map from the Toronto area.<\/p><p><img decoding=\"async\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/48325527916_20599b02b3_o.png\" alt=\"mapstraffic18\" \/><\/p><p>When traffic flow detail is requested, it is necessary to specify the road segment you want information about. This is done by providing a latitude and longitude on or near the road segment. In this example, we\u2019ve chosen the location on Pearl Street (latitude 43.648125 and longitude -79.385877) indicated by the blue dot. The response from the Traffic API to this request is as follows:<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7c53732 elementor-widget elementor-widget-code-highlight\" data-id=\"7c53732\" data-element_type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-json line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-json\">\n\t\t\t\t\t<xmp>{\r\n \"flowSegmentData\": {\r\n  \"frc\": \"FRC6\",\r\n  \"currentSpeed\": 11,\r\n  \"freeFlowSpeed\": 11,\r\n  \"currentTravelTime\": 132,\r\n  \"freeFlowTravelTime\": 132,\r\n  \"confidence\": 0.93,\r\n  \"coordinates\": {\r\n   \"coordinate\": [\r\n    { \"latitude\": 43.64834456714371,  \"longitude\": -79.38522694127332 },\r\n    { \"latitude\": 43.648312029614374, \"longitude\": -79.38535988662035 },\r\n    { \"latitude\": 43.648221176171454, \"longitude\": -79.38581670828187 },\r\n    { \"latitude\": 43.648093534999674, \"longitude\": -79.38638897774021 },\r\n    { \"latitude\": 43.647998525497734, \"longitude\": -79.38684125996943 },\r\n    { \"latitude\": 43.64791268872469,  \"longitude\": -79.38724768865437 },\r\n    { \"latitude\": 43.64765850161588,  \"longitude\": -79.3884527598657 },\r\n    { \"latitude\": 43.647573895981495, \"longitude\": -79.3887885056012 },\r\n    { \"latitude\": 43.64735328303331,  \"longitude\": -79.3898074544042 },\r\n    { \"latitude\": 43.64730360762897,  \"longitude\": -79.39003679126628 }\r\n   ]\r\n  },\r\n  \"openlr\": \"C8eMXh8J7DPWBv4f\/5gzBg==\",\r\n  \"@version\": \"traffic-service 2.0.004\"\r\n }\r\n}<\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-30be7632 elementor-widget elementor-widget-text-editor\" data-id=\"30be7632\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p><\/p>\n<pre lang=\"html\"><span style=\"color: var( --e-global-color-text ); font-family: var( --e-global-typography-text-font-family ), Sans-serif; font-weight: var( --e-global-typography-text-font-weight ); font-size: 1rem;\">Here we see that road is a local road (classification \"FRC6\") and that traffic conditions are ideal, with the current speed and travel time equal to the free flow speed and travel time.<\/span><br><\/pre>\n<p>The following map shows the locations in the response, with the green dot indicating the first location, yellow dots indicating intervening locations, and the red dot indicating the final location in the array.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5079\" src=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325527801_a329e06ddf_o.png\" alt=\"\" width=\"1000\" height=\"500\" srcset=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325527801_a329e06ddf_o.png 1000w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325527801_a329e06ddf_o-300x150.png 300w, https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/48325527801_a329e06ddf_o-768x384.png 768w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/p>\n<h2>Conclusion<\/h2>\n<p>Requesting traffic flow detail is relatively simple. As you can see, the TomTom APIs and SDKs take the complexity out of requesting maps that display traffic information and routes that get you to your destination quickly based on current traffic status. For more advanced scenarios, developers can take advantage of a wealth of information available from incident data and map layers to create unique maps and visualizations.<\/p>\n<p><em>This article first appeared on <a href=\"https:\/\/developer.tomtom.com\/blog\/build-different\/using-traffic-data-maps-and-routes\">TomTom&#8217;s blog<\/a><\/em>.<\/p>\n<p><em><span class=\"TextRun SCXW156001673 BCX2\" lang=\"EN-US\" xml:lang=\"EN-US\" data-contrast=\"none\"><span class=\"NormalTextRun SCXW156001673 BCX2\">If you\u2019re interested in developing expert technical content that performs, <\/span><\/span><a class=\"Hyperlink SCXW156001673 BCX2\" href=\"https:\/\/contentlab.com\/contact\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span class=\"TextRun Underlined SCXW156001673 BCX2\" lang=\"EN-US\" xml:lang=\"EN-US\" data-contrast=\"none\"><span class=\"NormalTextRun SCXW156001673 BCX2\" data-ccp-charstyle=\"Hyperlink\">let\u2019s have a conversation<\/span><\/span><\/a><span class=\"TextRun SCXW156001673 BCX2\" lang=\"EN-US\" xml:lang=\"EN-US\" data-contrast=\"none\"><span class=\"NormalTextRun SCXW156001673 BCX2\"> today.<\/span><\/span><\/em><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>In this article we will take a look at the kinds of traffic information available through TomTom APIs.<\/p>\n","protected":false},"author":3,"featured_media":5339,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[278,18,240],"tags":[284,270],"hashtags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Using Traffic Data with Maps and Routes &#183; Technical Content Marketing | ContentLab<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Using Traffic Data with Maps and Routes &#183; Technical Content Marketing | ContentLab\" \/>\n<meta property=\"og:description\" content=\"In this article we will take a look at the kinds of traffic information available through TomTom APIs.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/\" \/>\n<meta property=\"og:site_name\" content=\"Technical Content Marketing | ContentLab\" \/>\n<meta property=\"article:published_time\" content=\"2019-08-22T16:34:20+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-11-29T21:42:55+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2-1024x311.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"311\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"ContentLab\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@ContentLabIO\" \/>\n<meta name=\"twitter:site\" content=\"@ContentLabIO\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"ContentLab\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/\"},\"author\":{\"name\":\"ContentLab\",\"@id\":\"https:\/\/contentlab.com\/#\/schema\/person\/e1b8cacc1019e83e8d6cd9ab1a049532\"},\"headline\":\"Using Traffic Data with Maps and Routes\",\"datePublished\":\"2019-08-22T16:34:20+00:00\",\"dateModified\":\"2021-11-29T21:42:55+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/\"},\"wordCount\":1476,\"publisher\":{\"@id\":\"https:\/\/contentlab.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png\",\"keywords\":[\"JSON\",\"Mapping\"],\"articleSection\":[\"Hands-on Tutorial\",\"Portfolio\",\"Web\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/\",\"url\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/\",\"name\":\"Using Traffic Data with Maps and Routes &#183; Technical Content Marketing | ContentLab\",\"isPartOf\":{\"@id\":\"https:\/\/contentlab.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png\",\"datePublished\":\"2019-08-22T16:34:20+00:00\",\"dateModified\":\"2021-11-29T21:42:55+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#primaryimage\",\"url\":\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png\",\"contentUrl\":\"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png\",\"width\":1746,\"height\":530},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/contentlab.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Using Traffic Data with Maps and Routes\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/contentlab.com\/#website\",\"url\":\"https:\/\/contentlab.com\/\",\"name\":\"Technical Content Marketing | ContentLab\",\"description\":\"Technical Content Marketing Done Right.\",\"publisher\":{\"@id\":\"https:\/\/contentlab.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/contentlab.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/contentlab.com\/#organization\",\"name\":\"ContentLab.io\",\"url\":\"https:\/\/contentlab.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/contentlab.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/favicon-1.png\",\"contentUrl\":\"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/favicon-1.png\",\"width\":768,\"height\":768,\"caption\":\"ContentLab.io\"},\"image\":{\"@id\":\"https:\/\/contentlab.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/x.com\/ContentLabIO\",\"https:\/\/www.linkedin.com\/company\/17893315\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/contentlab.com\/#\/schema\/person\/e1b8cacc1019e83e8d6cd9ab1a049532\",\"name\":\"ContentLab\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/contentlab.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/3929e740ba8fe876f001a63220500e8e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/3929e740ba8fe876f001a63220500e8e?s=96&d=mm&r=g\",\"caption\":\"ContentLab\"},\"description\":\"ContentLab provides high-quality written articles, tutorials, courses, and other technical marketing materials to industry leaders. We create no-nonsense tech content that\u2019s purpose-built to attract, educate, and engage your technical audience.\",\"sameAs\":[\"https:\/\/contentlab.op\"],\"url\":\"https:\/\/contentlab.com\/author\/contentlab\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Using Traffic Data with Maps and Routes &#183; Technical Content Marketing | ContentLab","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/","og_locale":"en_US","og_type":"article","og_title":"Using Traffic Data with Maps and Routes &#183; Technical Content Marketing | ContentLab","og_description":"In this article we will take a look at the kinds of traffic information available through TomTom APIs.","og_url":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/","og_site_name":"Technical Content Marketing | ContentLab","article_published_time":"2019-08-22T16:34:20+00:00","article_modified_time":"2021-11-29T21:42:55+00:00","og_image":[{"width":1024,"height":311,"url":"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2-1024x311.png","type":"image\/png"}],"author":"ContentLab","twitter_card":"summary_large_image","twitter_creator":"@ContentLabIO","twitter_site":"@ContentLabIO","twitter_misc":{"Written by":"ContentLab","Est. reading time":"12 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#article","isPartOf":{"@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/"},"author":{"name":"ContentLab","@id":"https:\/\/contentlab.com\/#\/schema\/person\/e1b8cacc1019e83e8d6cd9ab1a049532"},"headline":"Using Traffic Data with Maps and Routes","datePublished":"2019-08-22T16:34:20+00:00","dateModified":"2021-11-29T21:42:55+00:00","mainEntityOfPage":{"@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/"},"wordCount":1476,"publisher":{"@id":"https:\/\/contentlab.com\/#organization"},"image":{"@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#primaryimage"},"thumbnailUrl":"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png","keywords":["JSON","Mapping"],"articleSection":["Hands-on Tutorial","Portfolio","Web"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/","url":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/","name":"Using Traffic Data with Maps and Routes &#183; Technical Content Marketing | ContentLab","isPartOf":{"@id":"https:\/\/contentlab.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#primaryimage"},"image":{"@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#primaryimage"},"thumbnailUrl":"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png","datePublished":"2019-08-22T16:34:20+00:00","dateModified":"2021-11-29T21:42:55+00:00","breadcrumb":{"@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#primaryimage","url":"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png","contentUrl":"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png","width":1746,"height":530},{"@type":"BreadcrumbList","@id":"https:\/\/contentlab.com\/using-traffic-data-with-maps-and-routes\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/contentlab.com\/"},{"@type":"ListItem","position":2,"name":"Using Traffic Data with Maps and Routes"}]},{"@type":"WebSite","@id":"https:\/\/contentlab.com\/#website","url":"https:\/\/contentlab.com\/","name":"Technical Content Marketing | ContentLab","description":"Technical Content Marketing Done Right.","publisher":{"@id":"https:\/\/contentlab.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/contentlab.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/contentlab.com\/#organization","name":"ContentLab.io","url":"https:\/\/contentlab.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/contentlab.com\/#\/schema\/logo\/image\/","url":"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/favicon-1.png","contentUrl":"https:\/\/contentlab.com\/wp-content\/uploads\/2021\/11\/favicon-1.png","width":768,"height":768,"caption":"ContentLab.io"},"image":{"@id":"https:\/\/contentlab.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/ContentLabIO","https:\/\/www.linkedin.com\/company\/17893315\/"]},{"@type":"Person","@id":"https:\/\/contentlab.com\/#\/schema\/person\/e1b8cacc1019e83e8d6cd9ab1a049532","name":"ContentLab","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/contentlab.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/3929e740ba8fe876f001a63220500e8e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/3929e740ba8fe876f001a63220500e8e?s=96&d=mm&r=g","caption":"ContentLab"},"description":"ContentLab provides high-quality written articles, tutorials, courses, and other technical marketing materials to industry leaders. We create no-nonsense tech content that\u2019s purpose-built to attract, educate, and engage your technical audience.","sameAs":["https:\/\/contentlab.op"],"url":"https:\/\/contentlab.com\/author\/contentlab\/"}]}},"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/contentlab.com\/wp-content\/uploads\/2019\/08\/2.png","_links":{"self":[{"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/posts\/2868"}],"collection":[{"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/comments?post=2868"}],"version-history":[{"count":7,"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/posts\/2868\/revisions"}],"predecessor-version":[{"id":6092,"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/posts\/2868\/revisions\/6092"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/media\/5339"}],"wp:attachment":[{"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/media?parent=2868"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/categories?post=2868"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/tags?post=2868"},{"taxonomy":"hashtags","embeddable":true,"href":"https:\/\/contentlab.com\/wp-json\/wp\/v2\/hashtags?post=2868"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}