Last active
February 13, 2016 14:53
-
-
Save saxena-gaurav/516fb24d2d11d1243adf to your computer and use it in GitHub Desktop.
AngularJS Leaflet directive heatmap example
This file contains hidden or 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
<leaflet center="center" layers="layers" height="480px" width="1640px"></leaflet> |
This file contains hidden or 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
.controller('publisherDataGeoReportController', ['$scope', '$http', '$rootScope', function($scope, $http, $rootScope) { | |
console.log('publisherDataGeoReportController called'); | |
var | |
reportHost = 'http://localhost', | |
reportPort = ':8080', | |
drawHeatMap; | |
$scope.dataPoints = []; | |
$scope.$watch('dataPoints', function() { | |
drawHeatMap(); | |
}); | |
angular.extend($scope, { | |
center: { | |
lat: 44.8091, | |
lng: -63.3636, | |
zoom: 9 | |
}, | |
layers: { | |
baselayers: { | |
osm: { | |
name: 'OpenStreetMap', | |
url: 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', | |
type: 'xyz' | |
} | |
}, | |
overlays: { | |
heatmap: { | |
name: 'Heat Map', | |
type: 'heatmap', | |
data: $scope.dataPoints, | |
visible: true | |
} | |
} | |
} | |
}); | |
drawHeatMap = function(data) { | |
console.log('drawHeatMap called ', $scope.dataPoints); | |
console.log('drawHeatMap called lat', $scope.center.lat); | |
$scope.layers = { | |
baselayers: { | |
osm: { | |
name: 'OpenStreetMap', | |
url: 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', | |
type: 'xyz' | |
} | |
}, | |
overlays: { | |
heatmap: { | |
name: 'Heat Map', | |
type: 'heatmap', | |
data: $scope.dataPoints, | |
visible: true | |
} | |
} | |
}; | |
}; | |
$scope.submit = function() { | |
console.log($scope.text); | |
var account = $scope.text; | |
var queryURL = reportHost + reportPort + '/publisherDataGeoReport?account=' + account; | |
console.log('angularjs url ', queryURL); | |
$http({method: 'GET', url: queryURL}). | |
success(function(data, status, headers, config) { | |
$rootScope.allplatformData = data; | |
$scope.dataPoints = [[44.651144316, -63.586260171, 0.5],[44.75, -63.5, 0.8]]; | |
}). | |
error(function(data, status, headers, config) { | |
console.log('ajax call returned error'); | |
}); | |
}; | |
}]); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment