{"id":1472,"date":"2020-02-20T19:40:38","date_gmt":"2020-02-20T18:40:38","guid":{"rendered":"https:\/\/bikefinisher.com\/?p=1472"},"modified":"2025-06-06T08:11:34","modified_gmt":"2025-06-06T06:11:34","slug":"prueba-open-source-maps-bicipenedes","status":"publish","type":"post","link":"https:\/\/bikefinisher.com\/?p=1472","title":{"rendered":"Prueba Open Source Maps para Bicipened\u00e8s"},"content":{"rendered":"<p><a href=\"http:\/\/bicipenedes.cat\/\">Bicipened\u00e8s<\/a>\u00a0es un proyecto que estoy preparando y esto es una prueba:<\/p>\n\n\t\t\t\t<div id=\"map_ol3js_1\" class=\"map undefined\" data-map_name=\"undefined\" data-map=\"map_ol3js_1\" style=\"width:100%; height:450px; overflow:hidden;border:2px solid grey;\" >\n\t\t\t\t  <div id=\"map_ol3js_1_popup\" class=\"ol-popup\" >\n\t\t\t\t\t<a href=\"#\" id=\"map_ol3js_1_popup-closer\" class=\"ol-popup-closer\"><\/a>\n\t\t\t\t\t<div id=\"map_ol3js_1_popup-content\" ><\/div>\n\t\t\t\t  <\/div>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t<link rel=\"stylesheet\" href=\"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/js\/OL\/6.1.1\/css\/ol.css\" type=\"text\/css\">\n\t\t\t\t<link rel=\"stylesheet\" href=\"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/css\/osm_map_v3.css\" type=\"text\/css\">\n\t\t\t\t<link rel=\"stylesheet\" href=\"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/css\/osm_map.css\" type=\"text\/css\">\n\t\t\t\t<!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->\n\t\t\t\t<script src=\"https:\/\/cdn.polyfill.io\/v2\/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL\"><\/script>\n\n\t\t\t\t<script src=\"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/js\/OL\/6.1.1\/ol.js\" type=\"text\/javascript\"><\/script>\n\t\t\t\t<script src=\"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/js\/osm-v3-plugin-lib.js\" type=\"text\/javascript\"><\/script>\n\t\t\t\t<script src=\"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/js\/osm-metabox-events.js\" type=\"text\/javascript\"><\/script>\n\t\t\t\t<script src=\"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/js\/osm-startup-lib.js\" type=\"text\/javascript\"><\/script>\n\t\t\t\t<script type=\"text\/javascript\">\n\t\t\t\t\ttranslations['openlayer'] = \"open layer\";\n\t\t\t\t\ttranslations['openlayerAtStartup'] = \"open layer at startup\";\n\t\t\t\t\ttranslations['generateLink'] = \"link to this map with opened layers\";\n\t\t\t\t\ttranslations['shortDescription'] = \"short description\";\n\t\t\t\t\ttranslations['generatedShortCode'] = \"to get a text control link paste this code in your wordpress editor\";\n\t\t\t\t\ttranslations['closeLayer'] = \"close layer\";\n\t\t\t\t\ttranslations['cantGenerateLink'] = \"put this string in the existing map short code to control this map\";\n\t\t\t\t<\/script>\n\n\t\t\t  <script type=\"text\/javascript\">vectorM['map_ol3js_1'] = [];\n\n\tvar attribution = new ol.control.Attribution({\n        collapsible: false\n      });\n      \n      var raster = new ol.layer.Tile({\n        source: new ol.source.OSM({ }),\n        zIndex: 90\n      });\n        var raster = new ol.layer.Tile({\n          source: new ol.source.OSM()\n        });\n      var Controls = ol.control.defaults({ attribution: false }).extend([\n          attribution\n      ]); \n\t\t\t  map_ol3js_1 = new ol.Map({\n\t\tcontrols: Controls,\n\t\t\n\t\t\t\tinteractions: ol.interaction.defaults({mouseWheelZoom:false}),\n\t\t\t\tlayers: [raster],\n\t\t\t\ttarget: \"map_ol3js_1\",\n\t\t\t\tview: new ol.View({\n\t\t\t\t  center: ol.proj.transform([1.7361,41.3409], \"EPSG:4326\", \"EPSG:3857\"),\n\t\t\t\t  zoom: 12\n\t\t\t\t})\n\t\t\t  });\n\t\t\t  \n    var style0 = {\n      \"Point\": [new ol.style.Style({\n\n          image: new ol.style.Icon({\n            anchor: [0.5, 41],\n            anchorXUnits: \"fraction\",\n            anchorYUnits: \"pixels\",\n            opacity: 0.75,\n            src: \"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/icons\/mic_red_pinother_02.png\"\n          })\n      })],\n\n      \"LineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 8\n        })\n      })],\n      \"MultiLineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 4\n        })\n      })]\n    };\n\t\t  var vectorL0 = new ol.layer.Vector({\n\t\t\t\tsource: new ol.source.Vector({\n\t\t\t\turl:\"..\/wp-content\/uploads\/Vilafranca - La Granada pel cam\u00ed de la Creu de la Peregrina.gpx\",\n\t\t\t\tformat: new ol.format.GPX({\n\t\t\t\t\textractStyles: false\n\t\t\t\t})\n\t\t\t}),\n\t\t\tzIndex: 92,\n\t\t\tstyle: function(feature, resolution) {return style0[feature.getGeometry().getType()];}\n\t\t  });\n\t\t  map_ol3js_1.addLayer(vectorL0);\n    var style1 = {\n      \"Point\": [new ol.style.Style({\n\n          image: new ol.style.Icon({\n            anchor: [0.5, 41],\n            anchorXUnits: \"fraction\",\n            anchorYUnits: \"pixels\",\n            opacity: 0.75,\n            src: \"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/icons\/mic_red_pinother_02.png\"\n          })\n      })],\n\n      \"LineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 8\n        })\n      })],\n      \"MultiLineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 4\n        })\n      })]\n    };\n\t\t  var vectorL1 = new ol.layer.Vector({\n\t\t\t\tsource: new ol.source.Vector({\n\t\t\t\turl:\"..\/wp-content\/uploads\/Vilafranca - Moja x Cam\u00ed de Moja.gpx\",\n\t\t\t\tformat: new ol.format.GPX({\n\t\t\t\t\textractStyles: false\n\t\t\t\t})\n\t\t\t}),\n\t\t\tzIndex: 92,\n\t\t\tstyle: function(feature, resolution) {return style1[feature.getGeometry().getType()];}\n\t\t  });\n\t\t  map_ol3js_1.addLayer(vectorL1);\n    var style2 = {\n      \"Point\": [new ol.style.Style({\n\n          image: new ol.style.Icon({\n            anchor: [0.5, 41],\n            anchorXUnits: \"fraction\",\n            anchorYUnits: \"pixels\",\n            opacity: 0.75,\n            src: \"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/icons\/mic_red_pinother_02.png\"\n          })\n      })],\n\n      \"LineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 8\n        })\n      })],\n      \"MultiLineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 4\n        })\n      })]\n    };\n\t\t  var vectorL2 = new ol.layer.Vector({\n\t\t\t\tsource: new ol.source.Vector({\n\t\t\t\turl:\"..\/wp-content\/uploads\/Vilafranca - Sant Miquel d'Ol\u00e8rdola pel Cam\u00ed de la Serreta.gpx\",\n\t\t\t\tformat: new ol.format.GPX({\n\t\t\t\t\textractStyles: false\n\t\t\t\t})\n\t\t\t}),\n\t\t\tzIndex: 92,\n\t\t\tstyle: function(feature, resolution) {return style2[feature.getGeometry().getType()];}\n\t\t  });\n\t\t  map_ol3js_1.addLayer(vectorL2);\n    var style3 = {\n      \"Point\": [new ol.style.Style({\n\n          image: new ol.style.Icon({\n            anchor: [0.5, 41],\n            anchorXUnits: \"fraction\",\n            anchorYUnits: \"pixels\",\n            opacity: 0.75,\n            src: \"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/icons\/mic_red_pinother_02.png\"\n          })\n      })],\n\n      \"LineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 8\n        })\n      })],\n      \"MultiLineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 4\n        })\n      })]\n    };\n\t\t  var vectorL3 = new ol.layer.Vector({\n\t\t\t\tsource: new ol.source.Vector({\n\t\t\t\turl:\"..\/wp-content\/uploads\/Vilafranca - Sant Pere Molanta.gpx\",\n\t\t\t\tformat: new ol.format.GPX({\n\t\t\t\t\textractStyles: false\n\t\t\t\t})\n\t\t\t}),\n\t\t\tzIndex: 92,\n\t\t\tstyle: function(feature, resolution) {return style3[feature.getGeometry().getType()];}\n\t\t  });\n\t\t  map_ol3js_1.addLayer(vectorL3);\n    var style4 = {\n      \"Point\": [new ol.style.Style({\n\n          image: new ol.style.Icon({\n            anchor: [0.5, 41],\n            anchorXUnits: \"fraction\",\n            anchorYUnits: \"pixels\",\n            opacity: 0.75,\n            src: \"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/icons\/mic_red_pinother_02.png\"\n          })\n      })],\n\n      \"LineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 8\n        })\n      })],\n      \"MultiLineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 4\n        })\n      })]\n    };\n\t\t  var vectorL4 = new ol.layer.Vector({\n\t\t\t\tsource: new ol.source.Vector({\n\t\t\t\turl:\"..\/wp-content\/uploads\/Vilafranca - Sant Sebasti\u00e0 dels Gorgs.gpx\",\n\t\t\t\tformat: new ol.format.GPX({\n\t\t\t\t\textractStyles: false\n\t\t\t\t})\n\t\t\t}),\n\t\t\tzIndex: 92,\n\t\t\tstyle: function(feature, resolution) {return style4[feature.getGeometry().getType()];}\n\t\t  });\n\t\t  map_ol3js_1.addLayer(vectorL4);\n    var style5 = {\n      \"Point\": [new ol.style.Style({\n\n          image: new ol.style.Icon({\n            anchor: [0.5, 41],\n            anchorXUnits: \"fraction\",\n            anchorYUnits: \"pixels\",\n            opacity: 0.75,\n            src: \"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/icons\/mic_red_pinother_02.png\"\n          })\n      })],\n\n      \"LineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 8\n        })\n      })],\n      \"MultiLineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 4\n        })\n      })]\n    };\n\t\t  var vectorL5 = new ol.layer.Vector({\n\t\t\t\tsource: new ol.source.Vector({\n\t\t\t\turl:\"..\/wp-content\/uploads\/Vilafranca - SM i Els Monjos pel cam\u00ed de Cal Frare.gpx\",\n\t\t\t\tformat: new ol.format.GPX({\n\t\t\t\t\textractStyles: false\n\t\t\t\t})\n\t\t\t}),\n\t\t\tzIndex: 92,\n\t\t\tstyle: function(feature, resolution) {return style5[feature.getGeometry().getType()];}\n\t\t  });\n\t\t  map_ol3js_1.addLayer(vectorL5);\n    var style6 = {\n      \"Point\": [new ol.style.Style({\n\n          image: new ol.style.Icon({\n            anchor: [0.5, 41],\n            anchorXUnits: \"fraction\",\n            anchorYUnits: \"pixels\",\n            opacity: 0.75,\n            src: \"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/icons\/mic_red_pinother_02.png\"\n          })\n      })],\n\n      \"LineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 8\n        })\n      })],\n      \"MultiLineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 4\n        })\n      })]\n    };\n\t\t  var vectorL6 = new ol.layer.Vector({\n\t\t\t\tsource: new ol.source.Vector({\n\t\t\t\turl:\"..\/wp-content\/uploads\/Vilafranca - St Pere Riudebitlles C-15.gpx\",\n\t\t\t\tformat: new ol.format.GPX({\n\t\t\t\t\textractStyles: false\n\t\t\t\t})\n\t\t\t}),\n\t\t\tzIndex: 92,\n\t\t\tstyle: function(feature, resolution) {return style6[feature.getGeometry().getType()];}\n\t\t  });\n\t\t  map_ol3js_1.addLayer(vectorL6);\n    var style7 = {\n      \"Point\": [new ol.style.Style({\n\n          image: new ol.style.Icon({\n            anchor: [0.5, 41],\n            anchorXUnits: \"fraction\",\n            anchorYUnits: \"pixels\",\n            opacity: 0.75,\n            src: \"https:\/\/bikefinisher.com\/wp-content\/plugins\/osm\/icons\/mic_red_pinother_02.png\"\n          })\n      })],\n\n      \"LineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 8\n        })\n      })],\n      \"MultiLineString\": [new ol.style.Style({\n        stroke: new ol.style.Stroke({\n          color: \"red\",\n          width: 4\n        })\n      })]\n    };\n\t\t  var vectorL7 = new ol.layer.Vector({\n\t\t\t\tsource: new ol.source.Vector({\n\t\t\t\turl:\"..\/wp-content\/uploads\/Vilafranca-P.I.St.P.Molanta.gpx\",\n\t\t\t\tformat: new ol.format.GPX({\n\t\t\t\t\textractStyles: false\n\t\t\t\t})\n\t\t\t}),\n\t\t\tzIndex: 92,\n\t\t\tstyle: function(feature, resolution) {return style7[feature.getGeometry().getType()];}\n\t\t  });\n\t\t  map_ol3js_1.addLayer(vectorL7);\n\t\t  var osm_controls = [\n\t\t\tnew ol.control.Attribution(),\n\t\t\tnew ol.control.MousePosition({\n\t\t\t  undefinedHTML: \"outside\",\n\t\t\t  projection: \"EPSG:4326\",\n\t\t\t  coordinateFormat: function(coordinate) {\n\t\t\t\t return ol.coordinate.format(coordinate, \"{y}, {x}\", 5);\n\t\t\t  }\n\t\t\t}),\n\t\t\tnew ol.control.OverviewMap({\n\t\t\t  collapsed: false\n\t\t\t}),\n\t\t\tnew ol.control.Rotate({\n\t\t\t  autoHide: false\n\t\t\t}),\n\t\t\tnew ol.control.ScaleLine(),\n\t\t\tnew ol.control.Zoom(),\n\t\t\tnew ol.control.ZoomSlider(),\n\t\t\tnew ol.control.ZoomToExtent({\n      extent: [-11243808.051695308, 1.202710291, 9561377.290892059, 6852382.107835932]\n    }),\n\t\t\tnew ol.control.FullScreen()\n\t\t  ]; \nmap_ol3js_1.addControl(osm_controls[8]);\nmap_ol3js_1.addControl(osm_controls[4]);\nmap_ol3js_1.addControl(osm_controls[1]);\nosm_addPopupClickhandler(map_ol3js_1,  \"map_ol3js_1\"); \nosm_addMouseHover(map_ol3js_1); <\/script>\n","protected":false},"excerpt":{"rendered":"<p>Bicipened\u00e8s\u00a0es un proyecto que estoy preparando y esto es una prueba:<\/p>\n","protected":false},"author":1,"featured_media":1483,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/bikefinisher.com\/index.php?rest_route=\/wp\/v2\/posts\/1472"}],"collection":[{"href":"https:\/\/bikefinisher.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bikefinisher.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bikefinisher.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bikefinisher.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1472"}],"version-history":[{"count":10,"href":"https:\/\/bikefinisher.com\/index.php?rest_route=\/wp\/v2\/posts\/1472\/revisions"}],"predecessor-version":[{"id":1485,"href":"https:\/\/bikefinisher.com\/index.php?rest_route=\/wp\/v2\/posts\/1472\/revisions\/1485"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bikefinisher.com\/index.php?rest_route=\/wp\/v2\/media\/1483"}],"wp:attachment":[{"href":"https:\/\/bikefinisher.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1472"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bikefinisher.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1472"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bikefinisher.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1472"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}