gistfile1.js

var app = angular.module('myApp', ['leaflet-directive']);

app.controller('MapController', [ "$scope", "$http", function($scope, $http) {

	angular.extend($scope, {
		defaults: {
			tileLayer: "http://server.arcgisonline.com/ArcGIS/rest/services/World_Shaded_Relief/MapServer/tile/{z}/{y}/{x}",
			scrollWheelZoom: false,
			maxZoom: 5,
		},
		center: {
			lat: 27.886,
			lng: 9.950,
			zoom: 3
		}
	});

	$http.get("data/circleMarkers.geo.json").success(function(data, status) {

		//delineating extent of radius 
		function magnitude (x) {
			if (x <= 15) {
				return 8;
			} else if (x <= 45) {
				return 13;
			} else if (x <= 75) {
				return 18;
			} else if (x <= 100) {
				return 23;
			} else if (x <= 225) {
				return 28;
			} else {
				return 38;
			}
		}

		// circleMarker styling
		var spillPoint = {
			radius: magnitude(features.properties.DispSize),
			fillColor: '#FF5454',
			color: '#813',
			weight: 1,
			opacity: 1,
			fillOpacity: 1
		};

        angular.extend($scope, {
            geojson: {
                data: data,
                pointToLayer: function (feature, latlng) {
        			return L.circleMarker(latlng, spillPoint);
        		}
        	}
        });
    });