axmans Barchart
by axman
HTML
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
JavaScript
///<reference path="../d3.v3.js"/>
var Barchart = function () {
var _maindatapoint = null;
var _facilityId = null;
var _selectedDate = null;
var _svg = null;
var _hierachy = null;
var _label = null;
var _formatLabel = d3.time.format("%a %d.%m.%Y");
var _formatTime = d3.time.format("%d.%m.%Y %H:%M ");
var chartWidth = 920; // 1116;
var margin = { top: 20, right: 20, bottom: 10, left: 40 },
width = chartWidth - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
var parseDate = d3.time.format("%Y-%m-%dT%H:%M:%S").parse;
var formatToHMtime = d3.time.format("%H:%M");
var formatToMM = d3.time.format("%b");
var formatToDDtime = d3.time.format("%a %d");
var temperatureBuffer = 1;
var x = d3.time.scale()
.rangeRound([0, width], .1);
var xy = d3.time.scale().range([0, width + margin.left + margin.right]);
var y = d3.scale.linear()
.range([height, 0]);
var xAxis = function (format) {
var d3ticks = null;
if (format.toString() == formatToDDtime) {
d3ticks = d3.time.days;
}
else if (format.toString() == formatToMM) {
return d3.svg.axis().scale(xy).ticks(d3.time.months, 1).tickFormat(d3.time.format("%b")).orient("bottom");//d3.svg.axis().scale(xy).orient("bottom");//
} else {
d3ticks = d3.time.hours;
}
return d3.svg.axis()
.scale(x)
.ticks(d3ticks, 1)
.tickFormat(format)
.orient("bottom");
};
var yAxis = function () {
return d3.svg.axis()
.scale(y)
.orient("left");
};
var initialize = function (maindatapoint, facilityid, date) {
_maindatapoint = maindatapoint;
_facilityId = facilityid;
_selectedDate = date;
// Clear the barChart Container before it is rendered again
barchart.innerHTML = '';
Barchart._svg =...