Created
November 10, 2015 11:52
-
-
Save Pabloska/535c4e410bc8875e6205 to your computer and use it in GitHub Desktop.
4mi
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
| <html> | |
| <head> | |
| <link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/3.11/themes/css/cartodb.css" /> | |
| <script src="http://libs.cartocdn.com/cartodb.js/v3/3.11/cartodb.js"></script> | |
| <script type="text/javascript" src="https://www.google.com/jsapi"></script> | |
| <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> | |
| <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 {width:100%; height:100%; padding: 0; margin: 0;} | |
| #map { width: 100%; height:610; background: black;} | |
| #menu { position: absolute; top: 70; left: 10; width: 130px; height:460px; z-index:10;border: 0px solid #777777;} | |
| #menu a { | |
| box-shadow: 2px 2px 2px #888888; | |
| opacity: 0.7; | |
| margin: 8px 0px 0 0; | |
| float: left; | |
| vertical-align: baseline; | |
| width: 115px; | |
| padding: 4px; | |
| text-align: center; | |
| font: bold 12px "Open Sans",sans-serif; | |
| line-height: normal; | |
| color: white; | |
| border-radius: 4px; | |
| border: 0.5px solid white; | |
| background: #003E7D; | |
| text-decoration: none; | |
| cursor: pointer; | |
| } | |
| #menu a.selected, | |
| #menu a:hover { | |
| color: #F84F40; | |
| } | |
| #dashboard { | |
| /box-shadow: 2px 2px 2px #888888; | |
| border: 1px solid #777777; | |
| border-radius: 4px; | |
| background: white; | |
| //border-left: 0px solid #000; | |
| height: 400; | |
| font-family: 'Open Sans', sans-serif; | |
| color: white; | |
| padding-top: 3px; | |
| position: absolute; | |
| left: 145; | |
| text-align: left; | |
| top: 135; | |
| z-index: 2001; | |
| opacity: 1; | |
| width: 210px; | |
| } | |
| #dashboard3 { | |
| border-radius: 4px; | |
| background: #F5F5F5; | |
| //border-left: 0px solid #000; | |
| height: 30; | |
| font-family: 'Open Sans', sans-serif; | |
| color: white; | |
| padding: 0px; | |
| position: absolute; | |
| left: 145; | |
| text-align: left; | |
| bottom: 20; | |
| z-index: 2001; | |
| opacity: 1; | |
| width: 225px; | |
| } | |
| #dashboard2 { | |
| border: 1px solid #777777; | |
| box-shadow: 5px 5px 5px #888888; | |
| border-radius: 4px; | |
| background: #F5F5F5; | |
| height: 590; | |
| color: white; | |
| padding: 0px; | |
| position: absolute; | |
| left: 10; | |
| text-align: left; | |
| top: 10; | |
| z-index: 2001; | |
| opacity: 1; | |
| width: 370px; | |
| </style> | |
| <script> | |
| var map; | |
| function init(){ | |
| // initiate leaflet map | |
| map = new L.Map('map', { | |
| zoomControl: false, | |
| //attributionControl: false, | |
| center: [15,20], | |
| width: 500, | |
| zoom: 4 | |
| }); | |
| L.control.zoom({ | |
| position:'topright' | |
| }).addTo(map); | |
| L.tileLayer('http://a{s}.acetate.geoiq.com/tiles/acetate-hillshading/{z}/{x}/{y}.png', { | |
| attribution: '<a href="http://migrantreport.org/">Map created by Migrant Report.' | |
| }).addTo(map); | |
| //http://a{s}.acetate.geoiq.com/tiles/acetate-hillshading/{z}/{x}/{y}.png | |
| //*adding first layer (removing interactivity) | |
| var layerUrl1 = 'https://migrantreport.cartodb.com/api/v2/viz/e6ff9b24-473f-11e5-b696-0e9d821ea90d/viz.json'; | |
| cartodb.createLayer(map, layerUrl1, { | |
| cartodb_logo: false, | |
| } | |
| ) | |
| .on('done', function(layer) { | |
| map.addLayer(layer); | |
| //layer.interaction.remove(); | |
| //layer.interaction = null; | |
| }).on('error', function() { | |
| //log the error | |
| }); | |
| //*adding second layer** | |
| var layerUrl2 = 'https://migrantreport.cartodb.com/api/v2/viz/f6e309a8-8700-11e5-bf5b-0e5db1731f59/viz.json'; | |
| var sublayers = []; | |
| cartodb.createLayer(map, layerUrl2, { | |
| cartodb_logo: false, | |
| } | |
| ) | |
| .addTo(map) | |
| .on('done', function(layer) { | |
| //***Create the sublayer to be toggled | |
| var subLayerOptions = { | |
| sql: "SELECT * FROM table_4mi_1", | |
| } | |
| var sublayer = layer.getSubLayer(0); | |
| sublayer.set(subLayerOptions); | |
| sublayers.push(sublayer); | |
| sublayer.setInteraction(true); | |
| sublayer.setInteractivity("cartodb_id,a_incident,a_location,a_no_incidents,a_no_people,b_death,b_extortion,b_food_and_water_problems,b_kidnapping,b_missing,b_physical,b_sexual,d_djibouti1,d_eritrea1,d_ethiopia1,d_somalia1,c_female,c_male"); | |
| sublayer.on('featureClick',function(e, latlng, pos, data, subLayerIndex) { | |
| $("#header").html("<p>" + data.a_location + "</p> "); | |
| $("#event3").html("<p>"+"Incident: " + data.a_incident+ "</p>"); | |
| //$("#event1").html("<p>"+ data.b_physical +" Physical Abuse" +"</p>"); | |
| //$("#event2").html("<p>"+ data.b_sexual +" Sexual Abuse" +"</p>"); | |
| //$("#event4").html("<p>"+ data.b_kidnapping +" Incidents of Kisnapping" + "</p>"); | |
| //$("#event5").html("<p>"+ data.b_extortion +" Extortion" +"</p>"); | |
| //$("#event6").html("<p>"+ data.b_missing +" Missing People" + "</p>"); | |
| //$("#event7").html("<p>"+ data.b_death +" Deaths" +"</p>"); | |
| //$("#event7").html("<p>"+ data.b_food_and_water_problems +" Lack of Food/Water" +"</p>"); | |
| }); | |
| }).on('error', function() { | |
| //log the error | |
| }); | |
| //higlight selected buttom | |
| $('.button').click(function() { | |
| $('.button').removeClass('selected'); | |
| $(this).addClass('selected'); | |
| LayerActions[$(this).attr('id')](); | |
| }); | |
| //layer actions | |
| var LayerActions = { | |
| all: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1", | |
| //cartocss: "#table_4mi{ marker-fill: green; }" | |
| }); | |
| return true; | |
| }, | |
| deaths: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where b_death <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9;marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point; marker-multi-policy: largest;marker-type: ellipse; marker-fill: #B81609; marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ b_death <= 5] { marker-width: 26;}#table_4mi_1 [ b_death <= 4] {marker-width: 20;}#table_4mi_1 [ b_death <= 3] { marker-width: 15;}#table_4mi_1 [ b_death <= 2] { marker-width: 10;}#table_4mi_1 [ b_death <= 1] { marker-width: 8;}" | |
| }); | |
| return true; | |
| }, | |
| Missing: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where b_missing <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point;marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609;marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ b_missing >= 11] { marker-width: 26;}#table_4mi_1 [ b_missing <= 11] { marker-width: 25.8;}#table_4mi_1 [ b_missing <= 10] { marker-width: 23.6;}#table_4mi_1 [ b_missing <= 8] { marker-width: 21.3;}#table_4mi_1 [ b_missing <= 6] { marker-width: 19.1;}#table_4mi_1 [ b_missing <= 5] {marker-width: 16.9;}#table_4mi_1 [ b_missing <= 4] { marker-width: 14.7;}#table_4mi_1 [ b_missing <= 3] { marker-width: 12.4;}#table_4mi_1 [ b_missing <= 2] {marker-width: 10.2;}#table_4mi_1 [ b_missing <= 1] { marker-width: 7;}" | |
| }); | |
| return true; | |
| }, | |
| extorsion: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where b_extortion <> 0 ", | |
| cartocss: "#table_4mi_1{marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3;marker-line-opacity: 1; marker-placement: point; marker-multi-policy: largest;marker-type: ellipse;marker-fill: #B81609;marker-allow-overlap: true;marker-clip: false;}#table_4mi_1 [ b_extortion <= 22] { marker-width: 26.0;}#table_4mi_1 [ b_extortion <= 15] { marker-width: 23.0;}#table_4mi_1 [ b_extortion <= 10] { marker-width: 21.0;}#table_4mi_1 [ b_extortion <= 8] { marker-width: 19.0;}#table_4mi_1 [ b_extortion <= 7] { marker-width: 17.0;}#table_4mi_1 [ b_extortion <= 6] { marker-width: 15.0;}#table_4mi_1 [ b_extortion <= 5] { marker-width: 13.0;}#table_4mi_1 [ b_extortion <= 4] { marker-width: 11.0;}#table_4mi_1 [ b_extortion <= 3] {marker-width: 9.0;}#table_4mi_1 [ b_extortion <= 2] {marker-width: 7.0;}" | |
| }); | |
| return true; | |
| }, | |
| kidnap: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where b_kidnapping <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point; marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609; marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ b_kidnapping <= 17] { marker-width: 26.0;}#table_4mi_1 [ b_kidnapping <= 14] { marker-width: 21.0;}#table_4mi_1 [ b_kidnapping <= 10] { marker-width: 19.0;}#table_4mi_1 [ b_kidnapping <= 8] {marker-width: 17.0;}#table_4mi_1 [ b_kidnapping <= 7] { marker-width: 15.0;}#table_4mi_1 [ b_kidnapping <= 4] { marker-width: 13.0;}#table_4mi_1 [ b_kidnapping <= 2] { marker-width: 9.0;}#table_4mi_1 [ b_kidnapping <= 1] { marker-width: 7.0;}"}); | |
| return true; | |
| }, | |
| Sexual: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where b_sexual <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point;marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609;marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ b_sexual <= 12] { marker-width: 26;}#table_4mi_1 [ b_sexual <= 12] { marker-width: 25.8;}#table_4mi_1 [ b_sexual <= 9] { marker-width: 23.6;}#table_4mi_1 [ b_sexual <= 6] { marker-width: 21.3;}#table_4mi_1 [ b_sexual <= 6] { marker-width: 19.1;}#table_4mi_1 [ b_sexual <= 4] { marker-width: 16.9;}#table_4mi_1 [ b_sexual <= 3] { marker-width: 14.7;}#table_4mi_1 [ b_sexual <= 3] {marker-width: 12.4;}#table_4mi_1 [ b_sexual <= 2] { marker-width: 10.2;}#table_4mi_1 [ b_sexual <= 1] { marker-width: 7;}" | |
| }); | |
| return true; | |
| }, | |
| physical: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where b_physical <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point;marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609;marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ b_physical <= 15] {marker-width: 26;}#table_4mi_1 [ b_physical <= 11] {marker-width: 25.8;}#table_4mi_1 [ b_physical <= 9] {marker-width: 23.6;}#table_4mi_1 [ b_physical <= 8] {marker-width: 21.3;}#table_4mi_1 [ b_physical <= 7] {marker-width: 19.1;}#table_4mi_1 [ b_physical <= 6] { marker-width: 16.9;}#table_4mi_1 [ b_physical <= 5] {marker-width: 14.7;}#table_4mi_1 [ b_physical <= 4] {marker-width: 12.4;}#table_4mi_1 [ b_physical <= 3] { marker-width: 10.2;}#table_4mi_1 [ b_physical <= 2] {marker-width: 7;}" | |
| }); | |
| return true; | |
| }, | |
| food_water: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where b_food_and_water_problems <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point;marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609;marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ b_food_and_water_problems <= 19] {marker-width: 26;}#table_4mi_1 [ b_food_and_water_problems <= 18] {marker-width: 25.8;}#table_4mi_1 [ b_food_and_water_problems <= 17] {marker-width: 23.6;}#table_4mi_1 [ b_food_and_water_problems <= 10] { marker-width: 21.3;}#table_4mi_1 [ b_food_and_water_problems <= 9] {marker-width: 19.1;}#table_4mi_1 [ b_food_and_water_problems <= 7.5] {marker-width: 16.9;}#table_4mi_1 [ b_food_and_water_problems <= 6] {marker-width: 14.7;}#table_4mi_1 [ b_food_and_water_problems <= 5] {marker-width: 12.4;}#table_4mi_1 [ b_food_and_water_problems <= 3] {marker-width: 10.2;}#table_4mi_1 [ b_food_and_water_problems <= 2] {marker-width: 7;}" | |
| }); | |
| return true; | |
| }, | |
| djibouti: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where d_djibouti1 <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF;marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point; marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609; marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ d_djibouti1 <= 3] { marker-width: 26;}#table_4mi_1 [ d_djibouti1 <= 2] { marker-width: 17.0;}#table_4mi_1 [ d_djibouti1 <= 1] { marker-width: 7.0;}"}); | |
| return true; | |
| }, | |
| eritrea: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where d_eritrea1 <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1;marker-placement: point; marker-multi-policy: largest;marker-type: ellipse;marker-fill: #B81609;marker-allow-overlap: true;marker-clip: false;}#table_4mi_1 [ d_eritrea1 <= 17] { marker-width: 26.0;}#table_4mi_1 [ d_eritrea1 <= 17] { marker-width: 23.3;}#table_4mi_1 [ d_eritrea1 <= 9] { marker-width: 21.7;}#table_4mi_1 [ d_eritrea1 <= 7] { marker-width: 20.0;}#table_4mi_1 [ d_eritrea1 <= 6] { marker-width: 18.3;}#table_4mi_1 [ d_eritrea1 <= 5] { marker-width: 16.7;}#table_4mi_1 [ d_eritrea1 <= 4] { marker-width: 15.0;}#table_4mi_1 [ d_eritrea1 <= 3] { marker-width: 12;}#table_4mi_1 [ d_eritrea1 <= 2] { marker-width: 10;}#table_4mi_1 [ d_eritrea1 <= 1] { marker-width: 7;}"}); | |
| return true; | |
| }, | |
| ethiopia: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where d_ethiopia1 <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point; marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609; marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ d_ethiopia1 <= 15] { marker-width: 26.0;}#table_4mi_1 [ d_ethiopia1 <= 10] { marker-width: 21.0;}#table_4mi_1 [ d_ethiopia1 <= 7] { marker-width: 17.0;}#table_4mi_1 [ d_ethiopia1 <= 5] { marker-width: 13.0;}#table_4mi_1 [ d_ethiopia1 <= 3] { marker-width: 11.0;}#table_4mi_1 [ d_ethiopia1 <= 1] { marker-width: 7.0;}"}); | |
| return true; | |
| }, | |
| somalia: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where d_somalia1 <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3;marker-line-opacity: 1;marker-placement: point;marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609; marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ d_somalia1 <= 15] {marker-width: 26.0;}#table_4mi_1 [ d_somalia1 <= 10] { marker-width: 21.7;}#table_4mi_1 [ d_somalia1 <= 9] { marker-width: 20.0;}#table_4mi_1 [ d_somalia1 <= 8] { marker-width: 18.3;}#table_4mi_1 [ d_somalia1 <= 7] { marker-width: 16.7;}#table_4mi_1 [ d_somalia1 <= 5] { marker-width: 15.0;}#table_4mi_1 [ d_somalia1 <= 4] { marker-width: 13;}#table_4mi_1 [ d_somalia1 <= 3] { marker-width: 10;}#table_4mi_1 [ d_somalia1 <= 1] { marker-width: 7;}"}); | |
| return true; | |
| }, | |
| female: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where c_female <> 0", | |
| cartocss: "#table_4mi_1{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point;marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609;marker-allow-overlap: true;marker-clip: false;}#table_4mi_1 [ c_female <= 11] {marker-width: 26.0;}#table_4mi_1 [ c_female <= 6] { marker-width: 21.0;}#table_4mi_1 [ c_female <= 4] { marker-width: 15.0;}#table_4mi_1 [ c_female <= 3] { marker-width: 11.0;}#table_4mi_1 [ c_female <= 1] { marker-width: 7.0;}"}); | |
| return true; | |
| }, | |
| male: function(){ | |
| sublayers[0].set({ | |
| sql: "SELECT * FROM table_4mi_1 where c_male <> 0", | |
| cartocss: "#table_4mi_1{marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 0.3; marker-line-opacity: 1; marker-placement: point; marker-multi-policy: largest; marker-type: ellipse; marker-fill: #B81609; marker-allow-overlap: true; marker-clip: false;}#table_4mi_1 [ c_male <= 18] { marker-width: 26.0;}#table_4mi_1 [ c_male <= 15] { marker-width: 20;}#table_4mi_1 [ c_male <= 13] { marker-width: 17.0;}#table_4mi_1 [ c_male <= 10] {marker-width: 15.0;}#table_4mi_1 [ c_male <= 6] {marker-width: 13.0;}#table_4mi_1 [ c_male <= 4] { marker-width: 10.0;}#table_4mi_1 [ c_male <= 2] {marker-width: 7.0;}"}); | |
| return true; | |
| }, | |
| } | |
| } | |
| </script> | |
| </head> | |
| <body onload="init()"> | |
| <div id='map'></div> | |
| <div style="position:relative;top:-600px;left: -80px; background-color:#fff; opacity: 1; text-align: center"> | |
| <a href="http://migrantreport.org/"> | |
| <img src="http://migrantreport.org/wp-content/uploads/migrant-report-logo.jpg" alt="migrnats" style="float:right;width:45px;height:40px;font-size:25;opacity: 0.7"> | |
| </a> | |
| </div> | |
| <div id="dashboard2"> | |
| <p style ="text-align: center;font-size:22;color:black;font-weight:bold;padding:10px;margin-bottom:0px;margin-top:0px;font-family: 'Open Sans', sans-serif;opacity: 0.8">Mixed Migration Mechanism Iniciative</p> | |
| <p><img src="http://migrantreport.org/wp-content/uploads/4mi1.png" alt="migrnats" style="float:right;width:100px;height:40px;opacity: 0.8;padding: 0px 0px 0px;margin-top:-5px;margin-right:60;"></p> | |
| <div id='menu'> | |
| <p style ="text-align: left;font-size:13;color:black;font-weight: bold;margin-bottom:-3px;font-family: 'Open Sans', sans-serif;">Filter by Incidents</p> | |
| <a href="#physical" id="physical" class="button capitals">Physical Abuse</a> | |
| <a href="#Sexual" id="Sexual" class="button megacities">Sexual Abuse</a> | |
| <a href="#kidnap" id="kidnap" class="button capitals">Kidnapping</a> | |
| <a href="#extorsion" id="extorsion" class="button megacities">Extortion</a> | |
| <a href="#Missing" id="Missing" class="button megacities">Missing People</a> | |
| <a href="#deaths" id="deaths" class="button megacities">Deaths</a> | |
| <a style ="margin-bottom:10px" href="#food_water" id="food_water" class="button megacities">Lack of Food/Water</a> | |
| <p style ="text-align: left;font-size:13;color:black;font-weight: bold;padding:0px;margin-bottom:-3px;font-family: 'Open Sans', sans-serif;">Filter by Country</p> | |
| <a href="#djibouti" id="djibouti" class="button megacities">Djibouti</a> | |
| <a href="#eritrea" id="eritrea" class="button capitals">Eritrea</a> | |
| <a href="#somalia" id="somalia" class="button megacities">Somalia</a> | |
| <a style ="margin-bottom:10px" href="#ethiopia" id="ethiopia" class="button megacities">Ethiopia</a> | |
| <p style ="text-align: left;font-size:13;color:black;font-weight: bold;padding:0px;margin-bottom:-3px;font-family: 'Open Sans', sans-serif;">Filter by Gender</p> | |
| <a href="#male" id="male" class="button megacities">Male</a> | |
| <a href="#female" id="female" class="button megacities">Female</a> | |
| </div> | |
| <div id="dashboard"> | |
| <div style ="font-size:15;color:#54544F;opacity: 1;padding: 0px 10px 0px;margin: 0cm 0cm 0cm 0cm;text-align: center;margin-top: 0px"> | |
| <div id="header" style ="margin-bottom:0px;margin-top:0px;font-size:18;color:#3B3B37; top:0px;padding-left:10px;font-weight: bold"></div> | |
| <p id="event3" style ="margin-bottom:20px;margin-top:4px;font-size:13;color:#3B3B37; top:0px;padding-left:10px;font-weight: bold"></p> | |
| <p id="event1" style ="margin-bottom:10px;margin-top:4px;font-size:11;color:#3B3B37; top:0px;padding-left:10px"><img src="http://migrantreport.org/wp-content/uploads/finger_06.png" alt="migrnats" style="padding-right:10px;float:right;width:170px;height:80px;font-size:20;opacity: 1;margin-top:5px,">Click over the symbols to display the location and incident type.</p> | |
| <p id="event2" style ="margin-bottom:10px;margin-top:4px;font-size:11;color:#3B3B37; top:0px;padding-left:10px"><img src="http://migrantreport.org/wp-content/uploads/finger_07.png" alt="migrnats" style="padding-right:10px;float:right;width:170px;height:80px;font-size:20;opacity: 1;margin-top: -15px,">Click over the lines to display pictures.(only available for the East-African route).</p> | |
| </div> | |
| </div> | |
| <div id="dashboard3" style= "bot:0px" > | |
| <p style ="font-size:10;color:#3B3B37; top:10px;padding-left:0px;margin-bottom:0">Data collected from Oct. 2014 to Oct. 2015</p> | |
| <p style ="font-size:10;color:#3B3B37; top:0px;padding-left:0px;margin-top:0">Sample size : 454 </p> | |
| </div> | |
| </div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment