Grapher.js 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645
  1. /*
  2. Copyright (c) 2004-2012, The Dojo Foundation All Rights Reserved.
  3. Available via Academic Free License >= 2.1 OR the modified BSD license.
  4. see: http://dojotoolkit.org/license for details
  5. */
  6. if(!dojo._hasResource["dojox.calc.Grapher"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
  7. dojo._hasResource["dojox.calc.Grapher"] = true;
  8. dojo.provide("dojox.calc.Grapher");
  9. dojo.require("dijit._Templated");
  10. dojo.require("dojox.math._base");
  11. dojo.require("dijit.dijit");
  12. dojo.require("dijit.form.DropDownButton");
  13. dojo.require("dijit.TooltipDialog");
  14. dojo.require("dijit.form.TextBox");
  15. dojo.require("dijit.form.Button");
  16. dojo.require("dijit.form.ComboBox");
  17. dojo.require("dijit.form.Select");
  18. dojo.require("dijit.form.CheckBox");
  19. dojo.require("dijit.ColorPalette");
  20. dojo.require("dojox.charting.Chart2D");
  21. dojo.require("dojox.charting.themes.Tufte");
  22. dojo.require("dojo.colors");
  23. dojo.experimental("dojox.calc.Grapher");
  24. dojo.declare(
  25. "dojox.calc.Grapher",
  26. [dijit._Widget, dijit._Templated],
  27. {
  28. // summary:
  29. // The dialog layout for making graphs
  30. //
  31. templateString: dojo.cache("dojox.calc", "templates/Grapher.html", "<div>\n<div dojoAttachPoint=\"chartsParent\" class=\"dojoxCalcChartHolder\"></div>\n<span dojoAttachPoint=\"outerDiv\">\n<div dojoType=\"dijit.form.DropDownButton\" dojoAttachPoint=\"windowOptions\" class=\"dojoxCalcDropDownForWindowOptions\" title=\"Window Options\">\n\t<div>Window Options</div>\n\t<div dojoType=\"dijit.TooltipDialog\" dojoAttachPoint=\"windowOptionsInside\" class=\"dojoxCalcTooltipDialogForWindowOptions\" title=\"\">\n\t\t<table class=\"dojoxCalcGraphOptionTable\">\n\t\t\t<tr>\n\t\t\t\t<td>\n\t\t\t\t\tWidth:\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t\t\t<input dojoType=\"dijit.form.TextBox\" dojoAttachPoint=\"graphWidth\" class=\"dojoxCalcGraphWidth\" value=\"500\" />\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t\t\tHeight:\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t\t\t<input dojoType=\"dijit.form.TextBox\" dojoAttachPoint=\"graphHeight\" class=\"dojoxCalcGraphHeight\" value=\"500\" />\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t\t<tr>\n\t\t\t\t<td>\n\t\t\t\t\tX >=\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t\t\t<input dojoType=\"dijit.form.TextBox\" dojoAttachPoint=\"graphMinX\" class=\"dojoxCalcGraphMinX\" value=\"-10\" />\n\t\t\t\t</td>\n\n\t\t\t\t<td>\n\t\t\t\t\tX <=\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t\t\t<input dojoType=\"dijit.form.TextBox\" dojoAttachPoint=\"graphMaxX\" class=\"dojoxCalcGraphMaxX\" value=\"10\" />\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t\t<tr>\n\t\t\t\t<td>\n\t\t\t\t\tY >=\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t\t\t<input dojoType=\"dijit.form.TextBox\" dojoAttachPoint=\"graphMinY\" class=\"dojoxCalcGraphMinY\" value=\"-10\" />\n\t\t\t\t</td>\n\n\t\t\t\t<td>\n\t\t\t\t\tY <=\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t\t\t<input dojoType=\"dijit.form.TextBox\" dojoAttachPoint=\"graphMaxY\" class=\"dojoxCalcGraphMaxY\" value=\"10\" />\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t</table>\n\t</div>\n</div>\n\n<BR>\n\n<div class=\"dojoxCalcGrapherFuncOuterDiv\">\n\t<table class=\"dojoxCalcGrapherFuncTable\" dojoAttachPoint=\"graphTable\">\n\t</table>\n</div>\n\n<div dojoType=\"dijit.form.DropDownButton\" dojoAttachPoint='addFuncButton' class=\"dojoxCalcDropDownAddingFunction\">\n\t<div>Add Function</div>\n\t<div dojoType=\"dijit.TooltipDialog\" dojoAttachPoint=\"addFuncInside\" class=\"dojoxCalcTooltipDialogAddingFunction\" title=\"\">\n\t\t<table class=\"dojoxCalcGrapherModeTable\">\n\t\t\t<tr>\n\t\t\t\t<td>\n\t\t\t\t\tMode:\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t\t\t<select dojoType=\"dijit.form.Select\" dojoAttachPoint=\"funcMode\" class=\"dojoxCalcFunctionModeSelector\">\n\t\t\t\t\t\t<option value=\"y=\" selected=\"selected\">y=</option>\n\t\t\t\t\t\t<option value=\"x=\">x=</option>\n\t\t\t\t\t</select>\n\t\t\t\t</td>\n\t\t\t\t<td>\n\t\t\t</tr>\n\t\n\t\t\t<tr>\n\t\t\t\t<td>\n\t\t\t\t\t<input dojoType=\"dijit.form.Button\" dojoAttachPoint=\"createFunc\" class=\"dojoxCalcAddFunctionButton\" label=\"Create\" />\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t</table>\n\t</div>\n</div>\n<BR>\n<BR>\n<table class=\"dijitInline dojoxCalcGrapherLayout\">\n\t<tr>\n\t\t<td class=\"dojoxCalcGrapherButtonContainer\">\n\t\t\t<input dojoType=\"dijit.form.Button\" class=\"dojoxCalcGrapherButton\" dojoAttachPoint='selectAllButton' label=\"Select All\" />\n\t\t</td>\n\t\t<td class=\"dojoxCalcGrapherButtonContainer\">\n\t\t\t<input dojoType=\"dijit.form.Button\" class=\"dojoxCalcGrapherButton\" dojoAttachPoint='deselectAllButton' label=\"Deselect All\" />\n\t\t</td>\n\t</tr>\n\t<tr>\n\t\t<td class=\"dojoxCalcGrapherButtonContainer\">\n\t\t\t<input dojoType=\"dijit.form.Button\" class=\"dojoxCalcGrapherButton\" dojoAttachPoint='drawButton'label=\"Draw Selected\" />\n\t\t</td>\n\t\t<td class=\"dojoxCalcGrapherButtonContainer\">\n\t\t\t<input dojoType=\"dijit.form.Button\" class=\"dojoxCalcGrapherButton\" dojoAttachPoint='eraseButton' label=\"Erase Selected\" />\n\t\t</td>\n\t</tr>\n\t<tr>\n\t\t<td class=\"dojoxCalcGrapherButtonContainer\">\n\t\t\t<input dojoType=\"dijit.form.Button\" class=\"dojoxCalcGrapherButton\" dojoAttachPoint='deleteButton' label=\"Delete Selected\" />\n\t\t</td>\n\t\t<td class=\"dojoxCalcGrapherButtonContainer\">\n\t\t\t<input dojoType=\"dijit.form.Button\" class=\"dojoxCalcGrapherButton\" dojoAttachPoint='closeButton' label=\"Close\" />\n\t\t</td>\n\t</tr>\n</table>\n</span>\n</div>\n"),
  32. widgetsInTemplate:true,
  33. addXYAxes: function(chart){
  34. // summary:
  35. // add or re-add the default x/y axes to the Chart2D provided
  36. // params:
  37. // chart is an instance of dojox.charting.Chart2D
  38. return chart.addAxis("x", {
  39. max: parseInt(this.graphMaxX.get("value")),
  40. min: parseInt(this.graphMinX.get("value")),
  41. majorLabels: true,
  42. minorLabels: true,
  43. //includeZero: true,
  44. minorTicks: false,
  45. microTicks: false,
  46. //majorTickStep: 1,
  47. htmlLabels: true,
  48. labelFunc: function(value){
  49. return value;
  50. },
  51. maxLabelSize: 30,
  52. fixUpper: "major", fixLower: "major",
  53. majorTick: { length: 3 }
  54. }).
  55. addAxis("y", {
  56. max: parseInt(this.graphMaxY.get("value")),
  57. min: parseInt(this.graphMinY.get("value")),
  58. labelFunc: function(value){
  59. return value;
  60. },
  61. maxLabelSize: 50,
  62. vertical: true,
  63. // htmlLabels: false,
  64. microTicks: false,
  65. minorTicks: true,
  66. majorTick: { stroke: "black", length: 3 }
  67. });
  68. },
  69. selectAll: function(){
  70. // summary
  71. // select all checkboxes inside the function table
  72. for(var i = 0; i < this.rowCount; i++){
  73. this.array[i][this.checkboxIndex].set("checked", true);
  74. }
  75. },
  76. deselectAll: function(){
  77. // summary
  78. // deselect all checkboxes inside the function table
  79. for(var i = 0; i < this.rowCount; i++){
  80. this.array[i][this.checkboxIndex].set("checked", false);
  81. }
  82. },
  83. drawOne: function(i){
  84. // i is a the index to this.array
  85. // override me
  86. },
  87. onDraw: function(){
  88. console.log("Draw was pressed");
  89. // override me
  90. },
  91. erase: function(i){
  92. // summary:
  93. // erase the chart inside this.array with the index i
  94. // params:
  95. // i is the integer index to this.array that represents the current row number in the table
  96. var nameNum = 0;
  97. var name = "Series "+this.array[i][this.funcNumberIndex]+"_"+nameNum;
  98. while(name in this.array[i][this.chartIndex].runs){
  99. this.array[i][this.chartIndex].removeSeries(name);
  100. nameNum++;
  101. name = "Series "+this.array[i][this.funcNumberIndex]+"_"+nameNum;
  102. }
  103. this.array[i][this.chartIndex].render();
  104. this.setStatus(i, "Hidden");
  105. },
  106. onErase: function(){
  107. // summary:
  108. // the erase button's onClick method
  109. // it see's if the checkbox is checked and then erases it if it is.
  110. for(var i = 0; i < this.rowCount; i++){
  111. if(this.array[i][this.checkboxIndex].get("checked")){
  112. this.erase(i);
  113. }
  114. }
  115. },
  116. onDelete: function(){
  117. // summary:
  118. // the delete button's onClick method
  119. // delete all of the selected rows
  120. for(var i = 0; i < this.rowCount; i++){
  121. if(this.array[i][this.checkboxIndex].get("checked")){
  122. this.erase(i);
  123. for(var k = 0; k < this.functionRef; k++){
  124. if(this.array[i][k] && this.array[i][k]["destroy"]){
  125. this.array[i][k].destroy();
  126. }
  127. }
  128. this.graphTable.deleteRow(i);
  129. this.array.splice(i, 1);
  130. this.rowCount--;
  131. i--;
  132. }
  133. }
  134. },
  135. // attributes to name the indices of this.array
  136. checkboxIndex: 0,
  137. functionMode: 1,
  138. expressionIndex: 2,
  139. colorIndex: 3,
  140. dropDownIndex: 4,
  141. tooltipIndex: 5,
  142. colorBoxFieldsetIndex: 6,
  143. statusIndex: 7,
  144. chartIndex: 8,
  145. funcNumberIndex: 9,
  146. evaluatedExpression: 10,
  147. functionRef: 11,
  148. createFunction: function(){
  149. // summary:
  150. // create a new row in the table with all of the dojo objects.
  151. var tr = this.graphTable.insertRow(-1);
  152. this.array[tr.rowIndex] = [];
  153. var td = tr.insertCell(-1);
  154. var d = dojo.create('div');
  155. td.appendChild(d);
  156. var checkBox = new dijit.form.CheckBox({}, d);
  157. this.array[tr.rowIndex][this.checkboxIndex] = checkBox;
  158. dojo.addClass(d, "dojoxCalcCheckBox");
  159. td = tr.insertCell(-1);
  160. var funcMode = this.funcMode.get("value");
  161. d = dojo.doc.createTextNode(funcMode);
  162. td.appendChild(d);
  163. this.array[tr.rowIndex][this.functionMode] = funcMode;
  164. //dojo.addClass(d, "dojoxCalcFunctionMode");// cannot use text nodes
  165. td = tr.insertCell(-1);
  166. d = dojo.create('div');
  167. td.appendChild(d);
  168. var expression = new dijit.form.TextBox({}, d);
  169. this.array[tr.rowIndex][this.expressionIndex] = expression;
  170. dojo.addClass(d, "dojoxCalcExpressionBox");
  171. var b = dojo.create('div');
  172. var color = new dijit.ColorPalette({changedColor:this.changedColor}, b);
  173. dojo.addClass(b, "dojoxCalcColorPalette");
  174. this.array[tr.rowIndex][this.colorIndex] = color;
  175. var c = dojo.create('div');
  176. var dialog = new dijit.TooltipDialog({content:color}, c);
  177. this.array[tr.rowIndex][this.tooltipIndex] = dialog;
  178. dojo.addClass(c, "dojoxCalcContainerOfColor");
  179. td = tr.insertCell(-1);
  180. d = dojo.create('div');
  181. td.appendChild(d);
  182. var colorBoxFieldset = dojo.create('fieldset');
  183. dojo.style(colorBoxFieldset, {backgroundColor: "black", width: "1em", height: "1em", display: "inline"});
  184. this.array[tr.rowIndex][this.colorBoxFieldsetIndex] = colorBoxFieldset;
  185. var drop = new dijit.form.DropDownButton({label:"Color ", dropDown:dialog}, d);
  186. drop.containerNode.appendChild(colorBoxFieldset);
  187. this.array[tr.rowIndex][this.dropDownIndex] = drop;
  188. dojo.addClass(d, "dojoxCalcDropDownForColor");
  189. /*td = tr.insertCell(-1);
  190. d = dojo.create('div');
  191. td.appendChild(d);
  192. var status = new dijit.form.TextBox({style:"width:50px", value:"Hidden", readOnly:true}, d);//hidden, drawn, or error
  193. this.array[tr.rowIndex][this.statusIndex] = status;
  194. dojo.addClass(d, "dojoxCalcStatusBox");*/
  195. td = tr.insertCell(-1);
  196. d = dojo.create('fieldset');
  197. d.innerHTML = "Hidden";
  198. this.array[tr.rowIndex][this.statusIndex] = d;
  199. dojo.addClass(d, "dojoxCalcStatusBox");
  200. td.appendChild(d);
  201. d = dojo.create('div');
  202. dojo.style(d, {position:"absolute", left:"0px", top:"0px"})
  203. this.chartsParent.appendChild(d);
  204. this.array[tr.rowIndex][this.chartNodeIndex] = d;
  205. dojo.addClass(d, "dojoxCalcChart");
  206. var chart = new dojox.charting.Chart2D(d).setTheme(dojox.charting.themes.Tufte).
  207. addPlot("default", { type: "Lines", shadow: {dx: 1, dy: 1, width: 2, color: [0, 0, 0, 0.3]} });
  208. this.addXYAxes(chart);
  209. this.array[tr.rowIndex][this.chartIndex] = chart;
  210. color.set("chart", chart);
  211. color.set("colorBox", colorBoxFieldset);
  212. color.set("onChange", dojo.hitch(color, 'changedColor'));
  213. this.array[tr.rowIndex][this.funcNumberIndex] = this.funcNumber++;
  214. this.rowCount++;
  215. },
  216. setStatus: function(i, status){
  217. // summary:
  218. // set the status of the row i to be status
  219. // params:
  220. // i is an integer index of this.array as well as a row index
  221. // status is a String, it is either Error, Hidden, or Drawn
  222. this.array[i][this.statusIndex].innerHTML = status; //this.array[i][this.statusIndex].set("value", status);
  223. },
  224. changedColor: function(){
  225. // summary:
  226. // make the color of the chart the new color
  227. // the context is changed to the colorPalette, and a reference to chart was added to it a an attribute
  228. var chart = this.get("chart");
  229. var colorBoxFieldset = this.get("colorBox");
  230. for(var i = 0; i < chart.series.length; i++){
  231. if(chart.series[i]["stroke"]){
  232. if(chart.series[i].stroke["color"]){
  233. chart.series[i]["stroke"].color = this.get("value");
  234. chart.dirty = true;
  235. }
  236. }
  237. }
  238. chart.render();
  239. dojo.style(colorBoxFieldset, {backgroundColor:this.get("value")});
  240. },
  241. makeDirty: function(){
  242. // summary:
  243. // if something in the window options is changed, this is called
  244. this.dirty = true;
  245. },
  246. checkDirty1: function(){
  247. // summary:
  248. // to stay in sync with onChange, checkDirty is called with a timeout
  249. setTimeout(dojo.hitch(this, 'checkDirty'), 0);
  250. },
  251. checkDirty: function(){
  252. // summary:
  253. // adjust all charts in this.array according to any changes in window options
  254. if(this.dirty){
  255. // change the axes of all charts if it is dirty
  256. for(var i = 0; i < this.rowCount; i++){
  257. this.array[i][this.chartIndex].removeAxis("x");
  258. this.array[i][this.chartIndex].removeAxis("y");
  259. this.addXYAxes(this.array[i][this.chartIndex]);
  260. }
  261. this.onDraw();
  262. }
  263. this.dirty = false;
  264. },
  265. postCreate: function(){
  266. // summary
  267. // add Event handlers, some additional attributes, etc
  268. this.inherited(arguments);// this is super class postCreate
  269. this.createFunc.set("onClick", dojo.hitch(this, 'createFunction'));
  270. this.selectAllButton.set("onClick", dojo.hitch(this, 'selectAll'));
  271. this.deselectAllButton.set("onClick", dojo.hitch(this, 'deselectAll'));
  272. this.drawButton.set("onClick", dojo.hitch(this, 'onDraw'));
  273. this.eraseButton.set("onClick", dojo.hitch(this, 'onErase'));
  274. this.deleteButton.set("onClick", dojo.hitch(this, 'onDelete'));
  275. this.dirty = false;
  276. this.graphWidth.set("onChange", dojo.hitch(this, 'makeDirty'));
  277. this.graphHeight.set("onChange", dojo.hitch(this, 'makeDirty'));
  278. this.graphMaxX.set("onChange", dojo.hitch(this, 'makeDirty'));
  279. this.graphMinX.set("onChange", dojo.hitch(this, 'makeDirty'));
  280. this.graphMaxY.set("onChange", dojo.hitch(this, 'makeDirty'));
  281. this.graphMinY.set("onChange", dojo.hitch(this, 'makeDirty'));
  282. this.windowOptionsInside.set("onClose", dojo.hitch(this, 'checkDirty1'));
  283. this.funcNumber = 0;
  284. this.rowCount = 0;
  285. this.array = [];
  286. },
  287. startup: function(){
  288. // summary
  289. // make sure the parent has a close button if it needs to be able to close
  290. this.inherited(arguments);// this is super class startup
  291. // close is only valid if the parent is a widget with a close function
  292. var parent = dijit.getEnclosingWidget(this.domNode.parentNode);
  293. if(parent && typeof parent.close == "function"){
  294. this.closeButton.set("onClick", dojo.hitch(parent, 'close'));
  295. }else{
  296. dojo.style(this.closeButton.domNode, "display", "none"); // hide the button
  297. }
  298. // add one row at the start
  299. this.createFunction();
  300. // make the graph bounds appear initially
  301. this.array[0][this.checkboxIndex].set("checked", true);
  302. this.onDraw();
  303. this.erase(0);
  304. this.array[0][this.expressionIndex].value = "";
  305. }
  306. });
  307. (function(){
  308. // summary
  309. // provide static functions for Grapher
  310. var
  311. epsilon = 1e-15 / 9,
  312. bigNumber = 1e200,
  313. log2 = Math.log(2),
  314. defaultParams = {graphNumber:0, fOfX:true, color:{stroke:"black"}};
  315. dojox.calc.Grapher.draw = function(/*Chart2D*/ chart, /*Function*/ functionToGraph, params){
  316. // summary
  317. // graph a chart with the given function.
  318. // params
  319. // chart is a dojox.charting.Chart2D object, functionToGraph is a function with one numeric parameter (x or y typically)
  320. // and params is an Object the can contain the number of the graph in the chart it is (an integer), a boolean saying if the functionToGraph is a function of x (otherwise y)
  321. // and the color, which is an object with a stroke with a color's name eg: color:{stroke:"black"}
  322. params = dojo.mixin({}, defaultParams, params);
  323. chart.fullGeometry();
  324. var x;
  325. var y;
  326. var points;
  327. if(params.fOfX==true){
  328. x = 'x';
  329. y = 'y';
  330. points = dojox.calc.Grapher.generatePoints(functionToGraph, x, y, chart.axes.x.scaler.bounds.span, chart.axes.x.scaler.bounds.lower, chart.axes.x.scaler.bounds.upper, chart.axes.y.scaler.bounds.lower, chart.axes.y.scaler.bounds.upper);
  331. }else{
  332. x = 'y';
  333. y = 'x';
  334. points = dojox.calc.Grapher.generatePoints(functionToGraph, x, y, chart.axes.y.scaler.bounds.span, chart.axes.y.scaler.bounds.lower, chart.axes.y.scaler.bounds.upper, chart.axes.x.scaler.bounds.lower, chart.axes.x.scaler.bounds.upper);
  335. }
  336. var i = 0;
  337. if(points.length > 0){
  338. for(; i < points.length; i++){
  339. if(points[i].length>0){
  340. chart.addSeries("Series "+params.graphNumber+"_"+i, points[i], params.color);
  341. }
  342. }
  343. }
  344. // you only need to remove the excess i's
  345. var name = "Series "+params.graphNumber+"_"+i;
  346. while(name in chart.runs){
  347. chart.removeSeries(name);
  348. i++;
  349. name = "Series "+params.graphNumber+"_"+i;
  350. }
  351. chart.render();
  352. return points;
  353. }
  354. dojox.calc.Grapher.generatePoints = function(/*Function*/ funcToGraph, /*String*/ x, /*String*/ y, /*Number*/ width, /*Number*/ minX, /*Number*/ maxX, /*Number*/ minY, /*Number*/ maxY){
  355. // summary:
  356. // create the points with information about the graph.
  357. // params:
  358. // funcToGraph is a function with one numeric parameter (x or y typically)
  359. // x and y are Strings which always have the values of "x" or "y". If y="x" and x="y" then it is creating points for the function as though it was a function of y
  360. // Number minX, Number maxX, Number minY, Number maxY are all bounds of the chart. If x="y" then maxY should be the maximum bound of x rather than y
  361. // Number width is the pixel width of the chart
  362. // output:
  363. // an array of arrays of points
  364. var pow2 = (1 << Math.ceil(Math.log(width) / log2));
  365. var
  366. dx = (maxX - minX) / pow2, // divide by 2^n instead of width to avoid loss of precision
  367. points = [], // [{x:value, y:value2},...]
  368. series = 0,
  369. slopeTrend,
  370. slopeTrendTemp;
  371. points[series] = [];
  372. var i = minX, k, p;
  373. for(var counter = 0; counter <= pow2; i += dx, counter++){
  374. p = {};
  375. p[x] = i;
  376. p[y] = funcToGraph({_name:x, _value:i, _graphing:true});//funcToGraph(i);
  377. if(p[x] == null || p[y] == null){
  378. return {};// someone pushed cancel in the val code
  379. }
  380. if(isNaN(p[y]) || isNaN(p[x])){
  381. continue;
  382. }
  383. points[series].push(p);
  384. if(points[series].length == 3){
  385. slopeTrend = getSlopePairTrend(slope(points[series][points[series].length - 3], points[series][points[series].length-2]), slope(points[series][points[series].length-2], points[series][points[series].length-1]));
  386. continue;
  387. }
  388. if(points[series].length < 4){
  389. continue;
  390. }
  391. slopeTrendTemp = getSlopePairTrend(slope(points[series][points[series].length - 3], points[series][points[series].length-2]), slope(points[series][points[series].length-2], points[series][points[series].length-1]));
  392. if(slopeTrend.inc != slopeTrendTemp.inc || slopeTrend.pos != slopeTrendTemp.pos){
  393. // var a = asymptoteSearch(funcToGraph, points[series][points[series].length - 2], points[series][points[series].length-1]);
  394. var a = asymptoteSearch(funcToGraph, points[series][points[series].length - 3], points[series][points[series].length-1]);
  395. p = points[series].pop();
  396. // this pop was added after changing the var a line above
  397. points[series].pop();
  398. for(var j = 0; j < a[0].length; j++){
  399. points[series].push(a[0][j]);
  400. }
  401. for(k = 1; k < a.length; k++){
  402. points[++series] = a.pop();
  403. }
  404. points[series].push(p);
  405. slopeTrend = slopeTrendTemp;
  406. }
  407. }
  408. while(points.length > 1){
  409. for(k = 0; k < points[1].length; k++){
  410. if(points[0][points[0].length - 1][x] == points[1][k][x]){
  411. continue;
  412. }
  413. points[0].push(points[1][k]);
  414. }
  415. points.splice(1, 1);
  416. }
  417. points = points[0];
  418. // make new series when it goes off the graph
  419. var s = 0;
  420. var points2 = [ [] ];
  421. for(k = 0; k < points.length; k++){
  422. var x1, y1, b, slope1;
  423. if(isNaN(points[k][y]) || isNaN(points[k][x])){
  424. while(isNaN(points[k][y]) || isNaN(points[k][x])){
  425. points.splice(k, 1);
  426. }
  427. points2[++s] = [];
  428. k--;
  429. }else if(points[k][y] > maxY || points[k][y] < minY){
  430. // make the last point's y equal maxY and find a matching x
  431. if(k > 0 && points[k - 1].y!=minY && points[k - 1].y!=maxY){
  432. slope1 = slope(points[k - 1], points[k]);
  433. if(slope1 > bigNumber){
  434. slope1 = bigNumber;
  435. }else if(slope1 < -bigNumber){
  436. slope1 = -bigNumber;
  437. }
  438. if(points[k][y] > maxY){
  439. y1 = maxY;
  440. }else{
  441. y1 = minY;
  442. }
  443. b = points[k][y] - slope1 * points[k][x];
  444. x1 = (y1 - b) / slope1;
  445. p = {};
  446. p[x] = x1;
  447. p[y] = funcToGraph(x1);//y1;//
  448. if(p[y]!=y1){
  449. p = findMinOrMaxY(funcToGraph, points[k - 1], points[k], y1);
  450. }
  451. points2[s].push(p);
  452. // setup the next series
  453. points2[++s] = []
  454. }
  455. var startK = k;
  456. while(k < points.length && (points[k][y] > maxY || points[k][y] < minY)){
  457. k++;
  458. }
  459. if(k >= points.length){
  460. if(points2[s].length == 0){
  461. points2.splice(s, 1);
  462. }
  463. break;
  464. }
  465. // connect the end graph
  466. if(k > 0 && points[k].y != minY && points[k].y != maxY){
  467. slope1 = slope(points[k - 1], points[k]);
  468. if(slope1 > bigNumber){
  469. slope1 = bigNumber;
  470. }else if(slope1 < -bigNumber){
  471. slope1 = -bigNumber;
  472. }
  473. if(points[k - 1][y] > maxY){
  474. y1 = maxY;
  475. }else{
  476. y1 = minY;
  477. }
  478. b = points[k][y] - slope1 * points[k][x];
  479. x1 = (y1 - b) / slope1;
  480. p = {};
  481. p[x] = x1;
  482. p[y] = funcToGraph(x1);//y1;//
  483. if(p[y]!=y1){
  484. p = findMinOrMaxY(funcToGraph, points[k - 1], points[k], y1);
  485. }
  486. points2[s].push(p);
  487. points2[s].push(points[k]);
  488. }
  489. }else{
  490. points2[s].push(points[k]);
  491. }
  492. }
  493. return points2;
  494. function findMinOrMaxY(funcToGraph, left, right, minMaxY){
  495. while(left<=right){
  496. var midX = (left[x]+right[x])/2;
  497. var mid = {};
  498. mid[x] = midX;
  499. mid[y] = funcToGraph(mid[x]);
  500. if(minMaxY==mid[y]||mid[x]==right[x]||mid[x]==left[x]){
  501. return mid;
  502. }
  503. var moveTowardsLarger = true;
  504. if(minMaxY<mid[y]){
  505. moveTowardsLarger = false;
  506. }
  507. if(mid[y]<right[y]){
  508. if(moveTowardsLarger){
  509. left = mid;
  510. }else{
  511. right = mid;
  512. }
  513. }else if(mid[y]<left[y]){
  514. if(!moveTowardsLarger){
  515. left = mid;
  516. }else{
  517. right = mid;
  518. }
  519. }
  520. }
  521. return NaN;
  522. }
  523. function asymptoteSearch(funcToGraph, pointStart, pointStop){
  524. var
  525. pointTemp = [ [], [] ],
  526. left = pointStart,
  527. right = pointStop,
  528. midpoint;
  529. while(left[x] <= right[x]){
  530. var midX = (left[x] + right[x]) / 2;
  531. midpoint = {};
  532. midpoint[x] = midX;
  533. midpoint[y] = funcToGraph(midX);
  534. var rx = nextNumber(midpoint[x]);
  535. var rightPoint = {};
  536. rightPoint[x] = rx;
  537. rightPoint[y] = funcToGraph(rx);
  538. if(Math.abs(rightPoint[y]) >= Math.abs(midpoint[y])){
  539. pointTemp[0].push(midpoint);
  540. left = rightPoint;
  541. }else{
  542. pointTemp[1].unshift(midpoint);
  543. if(right[x] == midpoint[x]){
  544. break;
  545. }
  546. right = midpoint;
  547. }
  548. }
  549. return pointTemp;
  550. }
  551. function getSlopePairTrend(slope1, slope2){
  552. var
  553. isInc = false,
  554. isPos = false;
  555. if (slope1 < slope2){
  556. isInc = true;
  557. }
  558. if (slope2 > 0){
  559. isPos = true;
  560. }
  561. return { inc: isInc, pos: isPos };
  562. }
  563. function nextNumber(v){
  564. var delta;
  565. if(v > -1 && v < 1){
  566. if(v < 0){ // special handling as we approach 0
  567. if(v >= -epsilon){
  568. delta = -v; // always stop at 0
  569. }else{
  570. delta = v / Math.ceil(v / epsilon); // divide distance to 0 into equal tiny chunks
  571. }
  572. }else{
  573. delta = epsilon;
  574. }
  575. }else{
  576. delta = Math.abs(v) * epsilon;
  577. }
  578. return v + delta;
  579. }
  580. function slope(p1, p2){
  581. return (p2[y] - p1[y]) / (p2[x] - p1[x]);
  582. }
  583. };
  584. })();
  585. }