{"id":3710,"date":"2019-03-25T17:45:36","date_gmt":"2019-03-25T20:45:36","guid":{"rendered":"http:\/\/xexeu.elipse.com.br\/pt\/kb76062-integrating-elipse-e3-with-google-maps-api\/"},"modified":"2023-01-26T11:22:48","modified_gmt":"2023-01-26T14:22:48","slug":"kb-76062-how-to-integrate-elipse-e3-to-google-maps-api","status":"publish","type":"post","link":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/","title":{"rendered":"KB-76062: How to integrate Elipse E3 to Google Maps API."},"content":{"rendered":"<div align=\"justify\">\n<div align=\"justify\">\n<p style=\"text-align: justify;\"><span style=\"color: #ff0000;\"><strong>NOTE:<\/strong><\/span> Support to API Maps for Internet Explorer was <a href=\"https:\/\/developers.google.com\/maps\/documentation\/javascript\/browsersupport\">discontinued<\/a> in November 2022. Therefore, with the end of support to IE, Elipse Software has developed a new solution that uses Edge (the engine responsible for rendering web content) to execute the Google Maps API para executar a API do Google Maps inside Elipse E3. This solution has been available since the release of the software&#8217;s <strong>version 6.5<\/strong>.<\/p>\n<p style=\"text-align: justify;\">Other solutions previously proposed here, such as using E3DataAccess and ActiveX WebBrowser with JSON format code, will no longer receive any support.<\/p>\n<h3><b><br \/>\nQuestion:<\/b><\/h3>\n<p>Is it possible to integrate Google Maps to Elipse E3? Can I send values from E3 tags (such as <i>Latitude <\/i>and <i>Longitude<\/i>) to Google Maps?<\/p>\n<h3><b>Solution:<\/b><\/h3>\n<p>Yes, this has been possible since the launch of <strong>Elipse E3 version 6.5<\/strong>, and this article will present a solution for integrating to the Google Maps API.<\/p>\n<p>&nbsp;<\/p>\n<h4>Web page receiving code in JSON format<\/h4>\n<p>The demo application loads an html page integrate to the Google Maps API, and uses a markers.lib library containing an XObject Marker.<\/p>\n<p>After instancing the Maker object in the Data folder, you can then establish its latitude and longitude position, measured unit, status,value, type, etc.<\/p>\n<p>As for <strong>type<\/strong>, it can be:<br \/>\n<strong>0 \u2013<\/strong> Meter<br \/>\n<strong>1 \u2013<\/strong> Water pump<br \/>\n<strong>2 \u2013<\/strong> Water tank<\/p>\n<p style=\"text-align: left;\"><strong>NOTE:<\/strong> You can change this definition at the file out\/mapsCore.js (<em>GoogleMapsHelper.prototype.getIconFromStatusAndType<\/em>).<\/p>\n<p>In this example, there is basically a script that scans the instances of Marker in the Data folder. Then, from this information, a message in JSON format is generated, to be periodically updated in data.json and filter.json files. Therefore, this information is loaded recurrently in the\u00a0 map.html file:<\/p>\n<p><em>fillDiv(&#8220;..\/assets\/data.json&#8221;, &#8220;data&#8221;);<\/em><br \/>\n<em>fillDiv(&#8220;..\/assets\/filter.json&#8221;, &#8220;filter&#8221;);<\/em><\/p>\n<p>The example below uses markers clustering to display a large number of markers in the map. The number in a cluster indicates the amount of markers it contains. As the zoom increases in any place in the cluster, the number in the cluster diminishes and then you can see individual places in the map.<\/p>\n<\/div>\n<p><a href=\"https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/03\/3689\/Maps_6_5.png\"><img loading=\"lazy\" class=\"alignnone wp-image-14067 size-full\" src=\"https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/03\/3689\/Maps_6_5.png\" alt=\"\" width=\"1920\" height=\"1040\" srcset=\"https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/03\/3689\/Maps_6_5.png 1920w, https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/03\/3689\/Maps_6_5-300x163.png 300w, https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/03\/3689\/Maps_6_5-1024x555.png 1024w, https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/03\/3689\/Maps_6_5-768x416.png 768w, https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/03\/3689\/Maps_6_5-1536x832.png 1536w\" sizes=\"(max-width: 1920px) 100vw, 1920px\" \/><\/a><\/p>\n<p>In order to open the .html file correctly in the application, regardless of the type of Viewer (local or remote), select the path in the folder \u201cmaps_project\u201d at Select Folder button.<\/p>\n<p>The application features some dependencies, such as Java Script files and\u00a0 assets and browser_proj folders, which must not be removed.<\/p>\n<p>To integrate this platform to Google Maps, you must purchase a <strong>Google Maps API key<\/strong>. For further information on usage and costs, check the links below:<\/p>\n<div align=\"justify\">\n<p><a href=\"https:\/\/developers.google.com\/maps\/gmp-get-started\">Get Started with Google Maps Platform<\/a><br \/>\n<a href=\"https:\/\/cloud.google.com\/maps-platform\/pricing?hl=pt\">Prices that scales to fit your needs<\/a><\/p>\n<\/div>\n<h4>Anexos:<\/h4>\n<p><a href=\"https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/03\/3689\/maps_project.zip\">maps_project.zip<\/a><\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Can Google Maps be integrated with Elipse E3? Can I send tag values from E3 (such as Latitude and Longitude) to Google Maps&#8230;<br \/>\nAutor<br \/>\nD\u00e9lio Damin, Felipe Scherer<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0},"categories":[826,763],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v19.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>KB-76062: How to integrate Elipse E3 to Google Maps API.<\/title>\n<meta name=\"description\" content=\"This article illustrates how to integrate Elipse E3 to the Google Maps API with Microsoft Edge. The Internet Explorer option was discontinued\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"KB-76062: How to integrate Elipse E3 to Google Maps API.\" \/>\n<meta property=\"og:description\" content=\"This article illustrates how to integrate Elipse E3 to the Google Maps API with Microsoft Edge. The Internet Explorer option was discontinued\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/\" \/>\n<meta property=\"og:site_name\" content=\"Elipse Knowledgebase\" \/>\n<meta property=\"article:publisher\" content=\"http:\/\/www.facebook.com\/elipsesoftware\" \/>\n<meta property=\"article:published_time\" content=\"2019-03-25T20:45:36+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-01-26T14:22:48+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/kb.elipse.com.br\/pt-br\/images\/ID5395\/1.png\" \/>\n<meta name=\"author\" content=\"D\u00e9lio Damin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"D\u00e9lio Damin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/\"},\"author\":{\"name\":\"D\u00e9lio Damin\",\"@id\":\"https:\/\/kb.elipse.com.br\/#\/schema\/person\/be597eff34b5f24af940a55332870778\"},\"headline\":\"KB-76062: How to integrate Elipse E3 to Google Maps API.\",\"datePublished\":\"2019-03-25T20:45:36+00:00\",\"dateModified\":\"2023-01-26T14:22:48+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/\"},\"wordCount\":700,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kb.elipse.com.br\/#organization\"},\"articleSection\":[\"E3DataAccess\",\"Scripts\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/\",\"url\":\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/\",\"name\":\"KB-76062: How to integrate Elipse E3 to Google Maps API.\",\"isPartOf\":{\"@id\":\"https:\/\/kb.elipse.com.br\/#website\"},\"datePublished\":\"2019-03-25T20:45:36+00:00\",\"dateModified\":\"2023-01-26T14:22:48+00:00\",\"description\":\"This article illustrates how to integrate Elipse E3 to the Google Maps API with Microsoft Edge. The Internet Explorer option was discontinued\",\"breadcrumb\":{\"@id\":\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\/\/kb.elipse.com.br\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"KB-76062: How to integrate Elipse E3 to Google Maps API.\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kb.elipse.com.br\/#website\",\"url\":\"https:\/\/kb.elipse.com.br\/\",\"name\":\"Elipse Knowledgebase\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/kb.elipse.com.br\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kb.elipse.com.br\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kb.elipse.com.br\/#organization\",\"name\":\"Elipse Software\",\"url\":\"https:\/\/kb.elipse.com.br\/\",\"sameAs\":[\"http:\/\/www.facebook.com\/elipsesoftware\"],\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/kb.elipse.com.br\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/05\/schererelipse-com-br\/logoElipse.png\",\"contentUrl\":\"https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/05\/schererelipse-com-br\/logoElipse.png\",\"width\":161,\"height\":58,\"caption\":\"Elipse Software\"},\"image\":{\"@id\":\"https:\/\/kb.elipse.com.br\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/kb.elipse.com.br\/#\/schema\/person\/be597eff34b5f24af940a55332870778\",\"name\":\"D\u00e9lio Damin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/kb.elipse.com.br\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/fdf251d36430f8dd22144c3f1bc53376?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/fdf251d36430f8dd22144c3f1bc53376?s=96&d=mm&r=g\",\"caption\":\"D\u00e9lio Damin\"},\"url\":\"https:\/\/kb.elipse.com.br\/en\/author\/delio\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"KB-76062: How to integrate Elipse E3 to Google Maps API.","description":"This article illustrates how to integrate Elipse E3 to the Google Maps API with Microsoft Edge. The Internet Explorer option was discontinued","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:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/","og_locale":"en_US","og_type":"article","og_title":"KB-76062: How to integrate Elipse E3 to Google Maps API.","og_description":"This article illustrates how to integrate Elipse E3 to the Google Maps API with Microsoft Edge. The Internet Explorer option was discontinued","og_url":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/","og_site_name":"Elipse Knowledgebase","article_publisher":"http:\/\/www.facebook.com\/elipsesoftware","article_published_time":"2019-03-25T20:45:36+00:00","article_modified_time":"2023-01-26T14:22:48+00:00","og_image":[{"url":"http:\/\/kb.elipse.com.br\/pt-br\/images\/ID5395\/1.png"}],"author":"D\u00e9lio Damin","twitter_card":"summary_large_image","twitter_misc":{"Written by":"D\u00e9lio Damin","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/#article","isPartOf":{"@id":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/"},"author":{"name":"D\u00e9lio Damin","@id":"https:\/\/kb.elipse.com.br\/#\/schema\/person\/be597eff34b5f24af940a55332870778"},"headline":"KB-76062: How to integrate Elipse E3 to Google Maps API.","datePublished":"2019-03-25T20:45:36+00:00","dateModified":"2023-01-26T14:22:48+00:00","mainEntityOfPage":{"@id":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/"},"wordCount":700,"commentCount":0,"publisher":{"@id":"https:\/\/kb.elipse.com.br\/#organization"},"articleSection":["E3DataAccess","Scripts"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/","url":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/","name":"KB-76062: How to integrate Elipse E3 to Google Maps API.","isPartOf":{"@id":"https:\/\/kb.elipse.com.br\/#website"},"datePublished":"2019-03-25T20:45:36+00:00","dateModified":"2023-01-26T14:22:48+00:00","description":"This article illustrates how to integrate Elipse E3 to the Google Maps API with Microsoft Edge. The Internet Explorer option was discontinued","breadcrumb":{"@id":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kb.elipse.com.br\/en\/kb-76062-how-to-integrate-elipse-e3-to-google-maps-api\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/kb.elipse.com.br\/en\/"},{"@type":"ListItem","position":2,"name":"KB-76062: How to integrate Elipse E3 to Google Maps API."}]},{"@type":"WebSite","@id":"https:\/\/kb.elipse.com.br\/#website","url":"https:\/\/kb.elipse.com.br\/","name":"Elipse Knowledgebase","description":"","publisher":{"@id":"https:\/\/kb.elipse.com.br\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kb.elipse.com.br\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/kb.elipse.com.br\/#organization","name":"Elipse Software","url":"https:\/\/kb.elipse.com.br\/","sameAs":["http:\/\/www.facebook.com\/elipsesoftware"],"logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/kb.elipse.com.br\/#\/schema\/logo\/image\/","url":"https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/05\/schererelipse-com-br\/logoElipse.png","contentUrl":"https:\/\/kb.elipse.com.br\/wp-content\/uploads\/2019\/05\/schererelipse-com-br\/logoElipse.png","width":161,"height":58,"caption":"Elipse Software"},"image":{"@id":"https:\/\/kb.elipse.com.br\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/kb.elipse.com.br\/#\/schema\/person\/be597eff34b5f24af940a55332870778","name":"D\u00e9lio Damin","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/kb.elipse.com.br\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/fdf251d36430f8dd22144c3f1bc53376?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/fdf251d36430f8dd22144c3f1bc53376?s=96&d=mm&r=g","caption":"D\u00e9lio Damin"},"url":"https:\/\/kb.elipse.com.br\/en\/author\/delio\/"}]}},"_links":{"self":[{"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/posts\/3710"}],"collection":[{"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/comments?post=3710"}],"version-history":[{"count":9,"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/posts\/3710\/revisions"}],"predecessor-version":[{"id":14150,"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/posts\/3710\/revisions\/14150"}],"wp:attachment":[{"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/media?parent=3710"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/categories?post=3710"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kb.elipse.com.br\/en\/wp-json\/wp\/v2\/tags?post=3710"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}