1 //Class c.protovis.LineChart2 : AreaChart2
  2 //This is the custom wrapper class for protovis area/line charts
  3 
  4 //Constructor
  5 wso2vis.s.chart.protovis.LineChart2 = function(div, chartTitle, chartDesc) {
  6     wso2vis.s.chart.protovis.AreaChart2.call(this, div, chartTitle, chartDesc);
  7 }
  8 
  9 // this makes c.protovis.LineChart2.prototype inherit from ProtovisStakedAreaChart
 10 wso2vis.extend(wso2vis.s.chart.protovis.LineChart2, wso2vis.s.chart.protovis.AreaChart2);
 11 
 12 //Public function load
 13 //Loads the chart inside the given HTML element
 14 wso2vis.s.chart.protovis.LineChart2.prototype.load = function (w, h) {
 15     if ( w !== undefined ) {
 16         this.width(w);
 17     }
 18     if ( h !== undefined ) {
 19         this.height(h);
 20     }
 21 
 22     var thisObject = this;
 23 
 24     this.x = pv.Scale.linear(0, 4).range(0, this.width());
 25     this.y = pv.Scale.linear(0, 50).range(0, this.height()*0.9);
 26     this.customXticks = [];
 27  
 28     this.vis = new pv.Panel()
 29         .canvas(function() { return thisObject.divEl(); })
 30         .width(function() { return thisObject.width(); })
 31         .height(function() { return thisObject.height(); })
 32         .def("i", -1)
 33         .bottom(160)
 34         .top(0)
 35         .left(30)
 36         .right(60);
 37 
 38     var panel = this.vis.add(pv.Panel)
 39         .top(function() { return (thisObject.height() * (1 - thisObject.titleSpacing())); })
 40         .height(function() { return (thisObject.height() * thisObject.titleSpacing()); })
 41         .data(function() { return thisObject.getData(thisObject); });
 42 
 43     var line = panel.add(pv.Line)
 44         .data(function(a) { return a; })
 45         .left(function(d) { return thisObject.x(d.x); })
 46         .bottom(function(d) { return thisObject.y(d.y); })
 47         .lineWidth(3)
 48         .title(function() {
 49             var dataObj = thisObject.traverseToDataField(thisObject.data, thisObject.dataField());
 50             if( dataObj instanceof Array ) {
 51                 return thisObject.onTooltip(dataObj[this.parent.index]);
 52             }
 53             else {
 54                 return thisObject.onTooltip(dataObj);
 55             }
 56         })
 57         .event("click", function() {
 58             var dataObj = thisObject.traverseToDataField(thisObject.data, thisObject.dataField());
 59             if( dataObj instanceof Array ) {
 60                 return thisObject.onClick(dataObj[this.parent.index]);
 61             }
 62             else {
 63                 return thisObject.onClick(dataObj);
 64             }
 65         });
 66     
 67     var lineDot = line.add(pv.Dot).title(function(d) { return d.y; })
 68         .visible(function() { return thisObject.marks(); })
 69         .fillStyle(function() { return this.strokeStyle(); });
 70         //.add(pv.Label);
 71 
 72     line.add(pv.Dot).title(function(d) { return d.y; })
 73         .visible(function() { return thisObject.marks(); })
 74         .strokeStyle("#fff")
 75         .lineWidth(1);
 76 
 77     /* Legend */
 78     panel.add(pv.Dot)
 79         .visible(function() { return thisObject.legend(); })
 80         .right(150)
 81         .fillStyle(function() { return line.strokeStyle(); })
 82         .bottom(function() { return (this.parent.index * 15) + 10; })
 83         .size(20) 
 84         .lineWidth(1)
 85         .strokeStyle("#000")
 86       .anchor("right").add(pv.Label)
 87         .text(function() { return thisObject.getDataLabel(this.parent.index); });
 88      
 89     panel.add(pv.Rule)
 90         .data(function() { return thisObject.customXticks; /*thisObject.x.ticks()*/ })
 91         .visible(function(d) { return (d >= 0); })
 92         .left(function(d) { return (Math.round(thisObject.x(d)) - 0.5); })
 93         .strokeStyle("rgba(128,128,128,.1)")
 94       .add(pv.Rule)
 95         .bottom(-2)
 96         .height(5)
 97         .strokeStyle("rgba(128,128,128,1)")
 98       .anchor("bottom").add(pv.Label)
 99         .textMargin(5)
100         .textBaseline("top")
101         .textAlign("left")
102         .textAngle(Math.PI / 3)
103         /*.text(function(d) { return thisObject.formatDataLabel( thisObject.traverseToDataField(thisObject.traverseToDataField(thisObject.traverseToDataField(thisObject.data, thisObject.dataField())[this.parent.index], thisObject.subDataField())[this.index], thisObject.xLabel()) ) + thisObject.xSuffix(); })*/
104         .text(function(d) { return thisObject.getXDataLabel(this.parent.index, this.index); })
105         .font(function() { return thisObject.labelFont(); })
106         .textStyle("rgba(128,128,128,0.5)");
107      
108     panel.add(pv.Rule)
109         .data(function() { return thisObject.y.ticks(); })
110         //.visible(function() { return !(this.index % 2); })
111         .bottom(function(d) { return (Math.round(thisObject.y(d)) - 0.5); })
112         .strokeStyle("rgba(128,128,128,.2)")
113       .add(pv.Rule)
114         .left(-5)
115         .width(5)
116         .strokeStyle("rgba(128,128,128,1)")
117       .anchor("left").add(pv.Label)
118         .textMargin(10)
119         .text(function(d) {return d.toFixed() + thisObject.ySuffix(); })
120         .font(function() { return thisObject.labelFont(); })
121         .textStyle("rgba(128,128,128,0.5)");
122 
123     this.vis.add(pv.Label)
124         .left(this.width() / 2)
125         .visible(function() { return !(thisObject.title() === ""); })
126         .top(16)
127         .textAlign("center")
128         .text(function() { return thisObject.title(); })
129         .font(function() { return thisObject.titleFont(); });
130 };
131 
132 wso2vis.s.chart.protovis.LineChart2.prototype.formatDataLabel = function (label) {
133 
134     return label;
135 };
136 
137 wso2vis.s.chart.protovis.LineChart2.prototype.getXDataLabel = function (parentIndex, thisIndex) {
138 
139     var thisObject = this;
140 
141     var a = thisObject.getDataObject( thisObject.traverseToDataField( thisObject.data, thisObject.dataField() ), [parentIndex] );
142 
143     var b = thisObject.getDataObject( thisObject.traverseToDataField( a, thisObject.subDataField() ), [thisIndex] );
144 
145     var c = thisObject.traverseToDataField( b, thisObject.xLabel() );
146 
147     return thisObject.formatDataLabel( c ) + thisObject.xSuffix();
148 };
149 
150