@mettek wrote:
I have try to create a test project for use Open Layers 3 with the new ionic 2 but it isn't work
This is my layout:
<ion-navbar *navbar> <button menuToggle> <ion-icon name="menu"></ion-icon> </button> <ion-title>Mappa</ion-title> </ion-navbar> <ion-content padding class="map-page"> <div id="map" class="map"></div> </ion-content>
And this is my controller:
import {Page} from 'ionic-angular'; @Page({ templateUrl: 'build/pages/map/map-page.html' }) export class MapPage { constructor(){ this.test = ["uno", "due", "tre"]; // var layer = ga.layer.create('ch.swisstopo.pixelkarte-farbe'); // var map = new ga.Map({ // target: 'map', // layers: [layer], // view: new ol.View({ // resolution: 500, // center: [670000, 160000] // }) // }); // this.map = map; console.log(this.map); var projection = ol.proj.get('EPSG:3857'); var map = new ol.Map({ target: this.map, layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View({ center: ol.proj.transform([8.92471, 46.07257], 'EPSG:4326', 'EPSG:3857'), zoom: 14 }) }); } }
I have also imported this library on my application:
<!DOCTYPE html> <html dir="ltr" lang="en"> <head> <title>Ionic</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="format-detection" content="telephone=no"> <meta name="msapplication-tap-highlight" content="no"> <script src="http://openlayers.org/en/v3.14.2/build/ol.js"></script> <link ios-href="build/css/app.ios.css" rel="stylesheet"> <link md-href="build/css/app.md.css" rel="stylesheet"> <link wp-href="build/css/app.wp.css" rel="stylesheet"> </head> <body> <ion-app></ion-app> <script src="cordova.js"></script> <script src="build/js/app.bundle.js"></script> </body> </html>
In a old project with ionic 1 this code is working. Any suggestion?
THX.
Posts: 1
Participants: 1