common.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. define("dojox/charting/axis2d/common", ["dojo/_base/lang", "dojo/_base/html", "dojo/_base/window", "dojo/dom-geometry", "dojox/gfx"],
  2. function(lang, html, win, domGeom, g){
  3. var common = lang.getObject("dojox.charting.axis2d.common", true);
  4. var clearNode = function(s){
  5. s.marginLeft = "0px";
  6. s.marginTop = "0px";
  7. s.marginRight = "0px";
  8. s.marginBottom = "0px";
  9. s.paddingLeft = "0px";
  10. s.paddingTop = "0px";
  11. s.paddingRight = "0px";
  12. s.paddingBottom = "0px";
  13. s.borderLeftWidth = "0px";
  14. s.borderTopWidth = "0px";
  15. s.borderRightWidth = "0px";
  16. s.borderBottomWidth = "0px";
  17. };
  18. var getBoxWidth = function(n){
  19. // marginBox is incredibly slow, so avoid it if we can
  20. if(n["getBoundingClientRect"]){
  21. var bcr = n.getBoundingClientRect();
  22. return bcr.width || (bcr.right - bcr.left);
  23. }else{
  24. return domGeom.getMarginBox(n).w;
  25. }
  26. };
  27. return lang.mixin(common, {
  28. // summary:
  29. // Common methods to be used by any axis. This is considered "static".
  30. createText: {
  31. gfx: function(chart, creator, x, y, align, text, font, fontColor){
  32. // summary:
  33. // Use dojox.gfx to create any text.
  34. // chart: dojox.charting.Chart
  35. // The chart to create the text into.
  36. // creator: dojox.gfx.Surface
  37. // The graphics surface to use for creating the text.
  38. // x: Number
  39. // Where to create the text along the x axis (CSS left).
  40. // y: Number
  41. // Where to create the text along the y axis (CSS top).
  42. // align: String
  43. // How to align the text. Can be "left", "right", "center".
  44. // text: String
  45. // The text to render.
  46. // font: String
  47. // The font definition, a la CSS "font".
  48. // fontColor: String|dojo.Color
  49. // The color of the resultant text.
  50. // returns: dojox.gfx.Text
  51. // The resultant GFX object.
  52. return creator.createText({
  53. x: x, y: y, text: text, align: align
  54. }).setFont(font).setFill(fontColor); // dojox.gfx.Text
  55. },
  56. html: function(chart, creator, x, y, align, text, font, fontColor, labelWidth){
  57. // summary:
  58. // Use the HTML DOM to create any text.
  59. // chart: dojox.charting.Chart
  60. // The chart to create the text into.
  61. // creator: dojox.gfx.Surface
  62. // The graphics surface to use for creating the text.
  63. // x: Number
  64. // Where to create the text along the x axis (CSS left).
  65. // y: Number
  66. // Where to create the text along the y axis (CSS top).
  67. // align: String
  68. // How to align the text. Can be "left", "right", "center".
  69. // text: String
  70. // The text to render.
  71. // font: String
  72. // The font definition, a la CSS "font".
  73. // fontColor: String|dojo.Color
  74. // The color of the resultant text.
  75. // labelWidth: Number?
  76. // The maximum width of the resultant DOM node.
  77. // returns: DOMNode
  78. // The resultant DOMNode (a "div" element).
  79. // setup the text node
  80. var p = win.doc.createElement("div"), s = p.style, boxWidth;
  81. // bidi support, if this function exists the module was loaded
  82. if(chart.getTextDir){
  83. p.dir = chart.getTextDir(text);
  84. }
  85. clearNode(s);
  86. s.font = font;
  87. p.innerHTML = String(text).replace(/\s/g, " ");
  88. s.color = fontColor;
  89. // measure the size
  90. s.position = "absolute";
  91. s.left = "-10000px";
  92. win.body().appendChild(p);
  93. var size = g.normalizedLength(g.splitFontString(font).size);
  94. // do we need to calculate the label width?
  95. if(!labelWidth){
  96. boxWidth = getBoxWidth(p);
  97. }
  98. // when the textDir is rtl, but the UI ltr needs
  99. // to recalculate the starting point
  100. if(p.dir == "rtl"){
  101. x += labelWidth ? labelWidth : boxWidth;
  102. }
  103. // new settings for the text node
  104. win.body().removeChild(p);
  105. s.position = "relative";
  106. if(labelWidth){
  107. s.width = labelWidth + "px";
  108. // s.border = "1px dotted grey";
  109. switch(align){
  110. case "middle":
  111. s.textAlign = "center";
  112. s.left = (x - labelWidth / 2) + "px";
  113. break;
  114. case "end":
  115. s.textAlign = "right";
  116. s.left = (x - labelWidth) + "px";
  117. break;
  118. default:
  119. s.left = x + "px";
  120. s.textAlign = "left";
  121. break;
  122. }
  123. }else{
  124. switch(align){
  125. case "middle":
  126. s.left = Math.floor(x - boxWidth / 2) + "px";
  127. // s.left = Math.floor(x - p.offsetWidth / 2) + "px";
  128. break;
  129. case "end":
  130. s.left = Math.floor(x - boxWidth) + "px";
  131. // s.left = Math.floor(x - p.offsetWidth) + "px";
  132. break;
  133. //case "start":
  134. default:
  135. s.left = Math.floor(x) + "px";
  136. break;
  137. }
  138. }
  139. s.top = Math.floor(y - size) + "px";
  140. s.whiteSpace = "nowrap"; // hack for WebKit
  141. // setup the wrapper node
  142. var wrap = win.doc.createElement("div"), w = wrap.style;
  143. clearNode(w);
  144. w.width = "0px";
  145. w.height = "0px";
  146. // insert nodes
  147. wrap.appendChild(p)
  148. chart.node.insertBefore(wrap, chart.node.firstChild);
  149. return wrap; // DOMNode
  150. }
  151. }
  152. });
  153. });