open an infowindow example
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Easy example | CartoDB.js</title> | |
| <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> | |
| <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> | |
| <link rel="shortcut icon" href="http://cartodb.com/assets/favicon.ico" /> | |
| <style> | |
| html, body, #map { | |
| height: 100%; | |
| padding: 0; | |
| margin: 0; | |
| } | |
| .list { | |
| position: absolute; | |
| background: white; | |
| top: 180px; | |
| left: 20px; | |
| padding: 20px; | |
| z-index: 10; | |
| } | |
| </style> | |
| <link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css" /> | |
| <!--[if lte IE 8]> | |
| <link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.ie.css" /> | |
| <![endif]--> | |
| </head> | |
| <body> | |
| <div id="map"></div> | |
| <div class="list"> | |
| <a href="#" class="link">open infowindow</a> | |
| </div> | |
| <!-- include cartodb.js library --> | |
| <script src="http://libs.cartocdn.com/cartodb.js/v3/cartodb.uncompressed.js"></script> | |
| <script> | |
| function openInfowindow(layer, latlng, cartodb_id) { | |
| layer.trigger('featureClick', null, latlng, null, { cartodb_id: cartodb_id }, 0); | |
| } | |
| function main() { | |
| cartodb.createVis('map', 'http://documentation.cartodb.com/api/v2/viz/7eb2096a-51d9-11e3-89a7-5404a6a683d5/viz.json', { | |
| shareable: false, | |
| title: false, | |
| description: false, | |
| search: false, | |
| tiles_loader: true, | |
| center_lat: 42, | |
| center_lon: -3, | |
| zoom: 6, | |
| legends: false | |
| }) | |
| .done(function(vis, layers) { | |
| // layer 0 is the base layer, layer 1 is cartodb layer | |
| var layer = layers[1]; | |
| $('.link').click(function() { | |
| openInfowindow(layer, [40.4000262645, -3.683351686], 5324) | |
| return false; | |
| }); | |
| }) | |
| .error(function(err) { | |
| console.log(err); | |
| }); | |
| } | |
| window.onload = main; | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment