JavaScript Diagram Builder - The Bar object

The Bar object is used to display a bar on the screen, especially to draw it in a diagram area. In order to find the appropriate screen position and size of the bar, the diagram functions ScreenX, ScreenY, RealX and RealY can be used. It is also possible, to move, resize, hide and delete a bar after it has been drawn.

This diagram was generated by

<SCRIPT Language="JavaScript">
document.open();
var D=new Diagram();
D.SetFrame(80, 160, 520, 360);
D.SetBorder(-1, 13, 0, 1000);
D.SetText("","", "Website Hits 2001");
D.XScale=0;
D.Draw("#FFFF80", "#004080", false);
var i, j, y;
Month=new Array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec");
for (i=0; i<12; i++)
{ y=500+Math.random()*400;
  j=D.ScreenX(i+0.5);
  if (i%2==0) new Bar(j-15, D.ScreenY(y), j+15, D.ScreenY(0), "#0000FF", Month[i], "#FFFFFF", "Hits per month");
  else new Bar(j-15, D.ScreenY(y), j+15, D.ScreenY(0), "#FF0000", Month[i], "#000000", "Hits per month");
}
document.close();
</SCRIPT>

You can use the following methods:

• var B = new Bar(theLeft, theTop, theRight, theBottom, theDrawColor, theText, theTextColor
  [, theTooltipText[, theAction]])
  //Constructor and Display, if theText="" then min_height=1 else min_height=12
  //if you want to use B.SetText() later, then you must initialize with a Text<>""
• B.SetVisibility(isVisible) //Show or Hide
• B.SetText(theText) //Text
• B.SetTitle(theTitle) //TooltipText
• B.MoveTo(theLeft, theTop) //Move
• B.ResizeTo(theLeft, theTop, theWidth, theHeight) //Resize
• B.Delete() //Delete DIV object of B from the document
• delete B //Destructor

« The Diagram object

The Dot object »