openlayers - Static image rotation in OpenLayers3 and AngularJS -
i using angular-openlayers-directive creating custom map. tried modify this example , used static image instead of maps in custom layers. bug goes error.
i looking solution of rotation of custom image map. can please on this.
without seeing code or knowing error message is hard problem is, here's example modified rotate static image:
<!doctype html> <html ng-app="demoapp"> <head> <script src="https://tombatossals.github.io/angular-openlayers-directive/bower_components/openlayers3/build/ol.js"></script> <script src="https://tombatossals.github.io/angular-openlayers-directive/bower_components/angular/angular.js"></script> <script src="https://tombatossals.github.io/angular-openlayers-directive/bower_components/angular-sanitize/angular-sanitize.js"></script> <script src="https://tombatossals.github.io/angular-openlayers-directive/dist/angular-openlayers-directive.js"></script> <link rel="stylesheet" href="https://tombatossals.github.io/angular-openlayers-directive/bower_components/openlayers3/build/ol.css" /> <script> var app = angular.module('demoapp', ['openlayers-directive']); app.controller('democontroller', ['$scope', '$http', 'oldata', function($scope, $http, oldata) { angular.extend($scope, { degrees: 0, center: { coord: [900, 600], zoom: 3 }, defaults: { view: { projection: 'pixel', extent: [0, 0, 1800, 1200], rotation: 0 } }, static: { source: { type: "imagestatic", url: "http://blog.wallpops.com/wp-content/uploads/2013/05/wpe0624.jpg", imagesize: [1800, 1200] } }, view: { extent: [0, 0, 1800, 1200], rotation: 0 } }); $scope.degreestoradians = function() { $scope.view.rotation = parsefloat($scope.degrees, 10).tofixed(2) * (math.pi / 180); }; $scope.$watch('view.rotation', function(value) { $scope.degrees = ($scope.view.rotation * 180 / math.pi).tofixed(2); }); }]); </script> </head> <body ng-controller="democontroller"> <openlayers ol-center="center" ol-defaults="defaults" ol-view="view" custom-layers="true" height="400px"> <ol-layer ol-layer-properties="static"></ol-layer> </openlayers> <h1>view rotation example</h1> <p>you can interact view rotation of map.</p> <p> <input type="range" min="-180" max="180" ng-change="degreestoradians()" ng-model="degrees" /> degrees: {{ degrees }}</p> <pre ng-bind="view | json"></pre> </body> </html>
and same example in plunker: http://plnkr.co/edit/zw7quyffwxqnne9rkdjz?p=preview
Comments
Post a Comment