AnglePicker - pick an angle or none

Default

	$("#myap").anglePicker({
	});

Enable Center

	$("#myap1").anglePicker({
		flat : true
		,enableCenter: true
		,value: null
	});

Enable Center, disable show value

	$("#myap1a").anglePicker({
		flat : true
		,enableCenter: true
		,showValueEnabled: false
		,value: null
	});

Value

	$("#myap2").anglePicker({
		flat : true
		,value: 41
	});

Handle Size

	$("#myap3").anglePicker({
		flat : true
		,handleSize: 20
	});

Snap

	$("#myap4").anglePicker({
		flat : true
		,snap: 45
	});

Size

	$("#myap5").anglePicker({
		flat : true
		,size: 100
	});

Change Event

null

	$("#myap6").anglePicker({
		flat : true
		, change: function(evt,data) {
			var val = "" + data.value;
			if (val != "null")
				val += "°";
			$("#myap6val").html(val);
		}
	});

Top and Clockwise

	$("#myap7").anglePicker({
		flat : true
		,start: -90
	});

anti-Clockwise

	$("#myap8").anglePicker({
		flat : true
		,clockwise: false
	});

Bottom and anti-Clockwise

	$("#myap9").anglePicker({
		flat : true
		,clockwise: false
		,start: -90
	});

Show Value Center

	$("#myap10").anglePicker({
		flat : true
		, enableCenter: true
		, showValue: true
		, showValueCenter: true
	});

Always Show Tooltip

	$("#myap11").anglePicker({
		flat : true
		, enableCenter: true
		, showValueAlwaysEnabled: true
	});

Full

	$("#myap100").anglePicker({	
		flat: true
		, value: 90
		, enableCenter: true
		, centerSize: 80
		, size: 100
		, handleSize: 20
		, handleType: "default"
		, snap: 45
		, showValue: true
		, decimalPlaces: 0
		, appendTo: "body"
		,change : function(evt, data) {
			console.log("change:"+data.value);
		}
	});

Set Value

	$("#myap110").anglePicker({
		flat : true
		,enableCenter: true
	});
	$("#myap110-button1").click(function() {
		$("#myap110").anglePicker("setValue",45);
	});
	$("#myap110-button2").click(function() {
		$("#myap110").anglePicker("setValue",null);
	});