Category Archives: 3D Charting

Phil 4.15.15

8:00 – 12:00 SR

  • My remote drives are not working on the servers any more. Put in a ticket
  • Fixed the Month1 != Month10 problem Dong found.
  • Was going to deploy the chart test but Bill had to leave. Maybe tomorrow.
  • Timesheets!

Phil 4.14.15

8:00 – 4:30 SR

  • FR seems to be running smoothly. Didn’t see Lenny.
  • Found a better linear regression class: http://commons.apache.org/proper/commons-math/apidocs/org/apache/commons/math3/stat/regression/SimpleRegression.html
  • Continuing to work on bars. Index and offset don’t seem to be working? Fixed.
  • Everything’s working. Now to automate the chart creation from the dataFormat and dataProvider.CombinedChart
  • Working out the interfaces for the format. This is helping a lot, particularly the ‘dictionary’ interface
  • Reworked the dataProvider and dataFormat interfaces and objects. This is now what it looks like:
  • DataFormat interface and example:
    export interface IChartElementFormat {
       label:string;
       objectName:string;
       type:string; // "area", "bar", pie, cluster
       hexColor:number;
    }
    
    export interface IChartFormat{
       [label:string]:IChartElementFormat;
    }
    
    this.dataFormat = { // might add 2D/3d, dynamic/static, etc.
       goals: {label:"Goals", objectName:"goals", type:"area", hexColor:0xFF0000},
       obligations:{label:"Obligations", objectName:"obligations",  type:"area",hexColor:0xFFFF00},
       pm_actuals:{label:"PM Actuals", objectName:"pm_actuals",  type:"bar",hexColor:0x00FF00},
       facts:{label:"Facts", objectName:"facts",  type:"bar",hexColor:0x0000FF},
       future_pm_actuals:{label:"Future PMA", objectName:"future_pm_actuals",  type:"area",hexColor:0xAAFFAA},
       future_facts:{label:"Future FACTS", objectName:"future_facts",  type:"area", hexColor:0xAAAAFF}
    };
  • DataProvider interfaces:
    export interface IChartBoundries {
       xmin:number;
       xmax:number;
       ymin:number;
       ymax:number;
       zmin?:number;
       zmax?:number;
    }
    
    export interface IChartDataMapping{
       [label:string]:number;
    }
    
    export interface IMinMax {
       min:number;
       max:number;
    }
    
    export interface IChartDataElement{
       [label:string]:IMinMax;
    }
    
    export interface IChartDataCollection{
       [objectName:string]:IChartDataElement;
    }
    
    export interface IChartData{
       type:string;
       min_max:IChartBoundries;
       mappings:IChartDataMapping[];
       data:IChartDataCollection;
    }
  • DataProvider example:
    this.dataProvider = {
       type:'XY', // RAH (Radius Angle Height) RAE (Radius Azimuth Elevation), XYZ, etc.
       min_max:{xmin:0.00, xmax:11.00, ymin:0.00, ymax:3715.30},
       mappings:[{Jan:0, Feb:1, Mar:2, Apr:3, May:4, Jun:5, Jul:6, Aug:7, Sep:8, Oct:9, Nov:10, Dec:11}],
       data:{
          goals: {
             Jan: {min: 0, max: 1000.00},
             Feb: {min: 0, max: 1100.00},
             Mar: {min: 0, max: 1210.00},
             Apr: {min: 0, max: 1331.00},
             May: {min: 0, max: 1464.10},
             Jun: {min: 0, max: 1610.51},
             Jul: {min: 0, max: 1771.56},
             Aug: {min: 0, max: 1948.72},
             Sep: {min: 0, max: 2143.59},
             Oct: {min: 0, max: 2357.95},
             Nov: {min: 0, max: 2593.74},
             Dec: {min: 0, max: 2853.12}
          },
          obligations: {
             Jan: {min: 0, max: 500.00},
             Feb: {min: 0, max: 600.00},
             Mar: {min: 0, max: 720.00},
             Apr: {min: 0, max: 864.00},
             May: {min: 0, max: 1036.80},
             Jun: {min: 0, max: 1244.16},
             Jul: {min: 0, max: 1492.99},
             Aug: {min: 0, max: 1791.59},
             Sep: {min: 0, max: 2149.91},
             Oct: {min: 0, max: 2579.89},
             Nov: {min: 0, max: 3095.87},
             Dec: {min: 0, max: 3715.04}
          },
          pm_actuals: {
             Jan: {min: 0, max: 250.00},
             Feb: {min: 0, max: 341.39},
             Mar: {min: 0, max: 495.27},
             Apr: {min: 0, max: 618.30},
             May: {min: 0, max: 923.08},
             Jun: {min: 0, max: 1318.68}
          },
          facts: {
             Jan: {min: 0, max: 125.00},
             Feb: {min: 0, max: 134.17},
             Mar: {min: 0, max: 134.31},
             Apr: {min: 0, max: 163.00},
             May: {min: 0, max: 164.36},
             Jun: {min: 0, max: 202.29}
          },
          future_pm_actuals: {
             Jun: {min: 1318.68, max: 1318.68},
             Jul: {min: 1257.91, max: 1499.96},
             Aug: {min: 1342.92, max: 1827.03},
             Sep: {min: 1427.94, max: 2154.10},
             Oct: {min: 1512.96, max: 2481.16},
             Nov: {min: 1597.97, max: 2808.23},
             Dec: {min: 1682.99, max: 3135.30}
          },
          future_facts: {
             Jun: {min: 202.29, max: 202.29},
             Jul: {min: 193.38, max: 215.48},
             Aug: {min: 196.77, max: 240.99},
             Sep: {min: 200.17, max: 266.49},
             Oct: {min: 203.57, max: 291.99},
             Nov: {min: 206.96, max: 317.50},
             Dec: {min: 210.36, max: 343.00}
          }
       }
    };
  • Need to place the dataProvider in the html to see if it works there.

Phil 4.13.15

8:00 – 5:00 SR

  • Figured out Bayes Theorem and got some spreadsheet examples working over the weekend. It’s effective and appropriate.
  • Started modifying DBTypedTable to handle tables that are created by sequential calls to the DB. Basically a way of making mode sophisticated joins.
  • Adding items into the 2Dchart test.
  • All full area charts work.
  • Need to get area charts that only cover part of the chart working. Done
  • Need to add DataPoints to the bottom of area charts that are not zero. Done
  • Need to add clustered bars, based on the number of where the bar is in the order of the dataFormat object.
  • Need to throw an event (or do something similar) when an items is clicked.

Phil 4.10.15

8:00 – 4:00 SR

  • Possibly a good book to get? https://www.ng-book.com/
  • Working on getting regression to predict upper and lower bounds
  • Working out the structure of the dataFormat and dataProvider Objects
  • dataFormat example
    this.dataFormat = { // might add 2D/3d, dynamic/static, etc.
       goals: "area",
       obligations:"area",
       pm_actuals:"bar",
       facts:"bar",
       pm_future:"area",
       facts_future:"area"
    };
  • Matching dataProvider example. Note the _mappings array and the fact that all items have a min/max value as well as a chart-wide minmax (no Z in this case)
    this.dataProvider = {
       _type:'XY', // RAH (Radius Angle Height) RAE (Radius Azimuth Elevation), XYZ, etc.
       _min_max:{xmin:0.00, xmax:11.00, ymin:0.00, ymax:3135.30},
       _mappings:[{Jan:0, Feb:1, Mar:2, Apr:3, May:4, Jun:5, Jul:6, Aug:7, Sep:8, Oct:9, Nov:10, Dec:11}],
       goals:{Jan:{min:0, max:1000.00}, Feb:{min:0, max:1100.00}, Mar:{min:0, max:1210.00}, Apr:{min:0, max:1331.00}, May:{min:0, max:1464.10}, Jun:{min:0, max:1610.51}, Jul:{min:0, max:1771.56}, Aug:{min:0, max:1948.72}, Sep:{min:0, max:2143.59}, Oct:{min:0, max:2357.95}, Nov:{min:0, max:2593.74}, Dec:{min:0, max:2853.12}},
       obligations:{Jan:{min:0, max:500.00}, Feb:{min:0, max:600.00}, Mar:{min:0, max:720.00}, Apr:{min:0, max:864.00}, May:{min:0, max:1036.80}, Jun:{min:0, max:1244.16}, Jul:{min:0, max:1492.99}, Aug:{min:0, max:1791.59}, Sep:{min:0, max:2149.91}, Oct:{min:0, max:2579.89}, Nov:{min:0, max:3095.87}, Dec:{min:0, max:3715.04}},
       pm_actuals:{Jan:{min:0, max:250.00}, Feb:{min:0, max:341.39}, Mar:{min:0, max:495.27}, Apr:{min:0, max:618.30}, May:{min:0, max:923.08}, Jun:{min:0, max:1318.68}},
       facts:{Jan:{min:0, max:125.00}, Feb:{min:0, max:134.17}, Mar:{min:0, max:134.31}, Apr:{min:0, max:163.00}, May:{min:0, max:164.36}, Jun:{min:0, max:202.29}},
       future_pm_actuals:{Jun:{min:1318.68, max:1318.68}, Jul:{min:1257.91, max:1499.96}, Aug:{min:1342.92, max:1827.03}, Sep:{min:1427.94, max:2154.10}, Oct:{min:1512.96, max:2481.16}, Nov:{min:1597.97, max:2808.23}, Dec:{min:1682.99, max:3135.30}},
       future_facts:{Jun:{min:202.29, max:202.29}, Jul:{min:193.38, max:215.48}, Aug:{min:196.77, max:240.99}, Sep:{min:200.17, max:266.49}, Oct:{min:203.57, max:291.99}, Nov:{min:206.96, max:317.50}, Dec:{min:210.36, max:343.00}}
    };
  • In excel, the results look like the following. Now working on incorporating into the graphing system prediction
  • Setting up a method to calculate the screen positions of the data points based on the dataProvider. Got margins, datagrids and areaCharts working. BarCharts are next. I need to think about how to cluster the bars. I’ll also need to add additional DataPoints when the botom axis is not (zero? horizontal?)

Phil 4.9.15

8:00 – 4:30 SR

  • Showed Lenny the new charts. He’ll be out tomorrow, so I’ll probably deploy the test version on Monday. We then had a long talk about the best way to statistically model the data in the first chart. It really sounds like Bayes might be the way to do this. Which is awesomely cool, because my schoolwork and jobwork are perfectly aligned for the weekend. Gonna charge me some hours figuring out Bayes.
  • Building the dataFormat and dataProvider Objects. Since Lenny wants future performance, I’m pulling in the Apache commons math jar for linear regression. I think I want OLSMultipleLinearRegression
  • Added SimpleLinearRegression to JavaUtils that wraps OLSMultipleLinearRegression and hides some complexity.that is not intuitively obvious documentation. Glad I found this example. Added to Subversion. I’ll probably need to add a method that gets the error so that I can add that to the future error.
  • More JSON tomorrow, then on to Bayes. Did get this book

Phil 4.8.15

8:00 – 4:00 SR

  • Kinda promised Ronda cookies
  • Worked through Markov Chain Matrix math. I think I understand how it relates to PageRank Matrix math, and therefore, how Page Rank is a Markov Chain.
  • Working through charting bugs
    • Added font and color choice to dprint
    • Fixed canvas font application in WebGlComponentClasses
    • Updated WebGlInterfaces
    • Fixed bugs in ChartInfo
  • Newest version is live
  • Adding JSON objects for charts to read and display.

Phil 4.7.15

8:00 – 4:00 SR

  • Committed to bringing in a test version of the charting. I probably need a WGLChart2D so that there’s no DB complications initially. Need to verify that the JSON servlet still works though.
  • Added legends back in. Had to fix a bad string test
  • The CanvasRenderer moved. Had to fix that. Verified it still works
  • Removing chart classes from the controller and putting them in the classes folder
  • Added WebGlCharts to classes directory and to the makefile. Had problems until I realized that I had created “WegGlCharts”. Stupid fingers.
  • Starrting WGLChart2D
  • My new dev box is here!
  • 2D is mostly ported and running. A few more things to clean up before packaging to deploy. Visible here.

Phil 3.31.15

8:00 – 4:30 SR

  • Working on debugging POC name issue. Fixed? Had to roll back some things to make the data binding work?
  • Migrating NovettaUtils to the lib directory, then using that for inheriting in the charts module. Which was going to be migrated before discovering the fat arrow inherit feature (FAIF). So yeah. migrate that too.
  • Nope, realized that there was no way to maintain state using the approach that I tried. Looking into using the actual prototype chaining pattern instead.
  • Ok, kinda hit a wall here. Note that the breakpoint and the console.log disagree:

wtf

Phil 3.30.15

8:00 – 3:00 SR

  • Mark, who is standing in for Lenny, found this and I verified. Entering a POC in a new FR doesn’t show up in the list.
  • Testing the new callback scheme in typescript testbed.
  • Tried it, and was quite hopeful, but the scheme failed with the timeoutService callback. Bad, because that’s a basic Angular component and messing with that just isn’t in the cards. But the fatPrototype/fatSuper scheme works. Now I just need to be able to make prototype chaining work right. Done! Here’s the entire class:
    export class FatSuperBase {
       public functionMap:any[];
       constructor() {
          this.functionMap = [];
       }
       public setFatPrototype(fn:Function, n:string){
          // TODO: look for earlier prototypes that we might need to call
          if(!this.functionMap.hasOwnProperty(n)){
             this.functionMap[n] = [];
          }
          this.functionMap[n].push(fn);
       }
       public fatSuper(fnName:string, childArgs:IArguments){
          // TODO: look for earlier prototypes that we might need to call
          var fn:Function;
          var farray:Function[];
          if(this.functionMap.hasOwnProperty(fnName)){
             farray = this.functionMap[fnName];
             fn = farray[farray.length-1];
             fn.apply(fn, childArgs);
          }else{
             console.log("fatSuper(): function '"+fnName+"'does not exist on the prototype chain");
          }
       }
    }

Phil 3.27.17

7:00 – 3:30 SR

  • Timesheets
  • Wow – upgraded to Windows 7! Of course, that means that I don’t have PuTTY and can’t get to the servers. Put in a ticket…
  • Need to see how super() works in JavaScript. I’m thinking it should be possible to write a Utils.FatSuper(this.myFnPtr) static method that will do the same.
  • TypeScript parent class (Parts stripped out for clarity):
    export class TestController implements ITestController {
       // standard TypeScript constructor
       constructor() {
       }
    
       public extendableFunction():void{
          alert("It's extendableFunction()");
       }
    
       public fatArrowFunction = ():void => {
          alert("It's fatArrowFunction()");
       }
    }
  • Compiled JavaScript of above:
    var TestController = (function () {
        // standard TypeScript constructor
        function TestController() {
            var _this = this;
            
            this.fatArrowFunction = function () {
                alert("It's fatArrowFunction()");
            };
        }
        TestController.prototype.extendableFunction = function () {
            alert("It's extendableFunction()");
        };
        return TestController;
    })();
    InheritApp.TestController = TestController;
  • TypeScript child class:
    export class TestController2 extends TestController implements ITestController2 {
       myInheritedString:string;
    
       // standard inheriting constructor pattern. Note that 'super' must be on the first line and
       // that the arguments from angular get passed through
       constructor(){
          super();
       }
    
       public extendableFunction():void{
          super.extendableFunction();
       }
    }
  • Compiled JavaScript of above:
    var TestController2 = (function (_super) {
        __extends(TestController2, _super);
        
        function TestController2() {
            _super.call(this);
        }
        TestController2.prototype.extendableFunction = function () {
            _super.prototype.extendableFunction.call(this);
        };
        return TestController2;
    })(TestController);
    InheritApp.TestController2 = TestController2;
  • JavaScript of above with all the contents commented out:
    var TestController2 = (function (_super) {
        __extends(TestController2, _super);
        function TestController2() {
            _super.apply(this, arguments);
        }
        return TestController2;
    })(TestController);
    InheritApp.TestController2 = TestController2;
  • As an aside, __extends is just parasitic inheritance:
    var __extends = this.__extends || function (d, b) {
        for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
        function __() { this.constructor = d; }
        __.prototype = b.prototype;
        d.prototype = new __();
    };
  • So we know a few things now:
    • extending in TypeScript means that the child class is called with the parent class passed in as an argument called ‘_super’
    • Fat arrow functions are defined in the constructor as variables pointing to functions and are attached to ‘this’, not ‘_this’
  • I tried looking for the properties in the debugger, but couldn’t really see what was going on in the JavaScript. So I added a loop over the properties in the TestController2 constructor. FatArrowFunction is listed and extendableFunction is not. To me this makes sense, as extendableFunction is on the prototype:
    this[fatArrowFunction] = function () {
            alert("It's fatArrowFunction()");
        }
  • Building on the above, we can make what boils down to our own prototype for fat functions. The other option is to turn everything into fat functions as per this nifty piece of work, discussed on this page. I have a concern about adding all this wrapping to functions, so until I run some tests and see what’s faster, here’s a way of doing it semi-manually. Here’s the parent code:
    export class TestController implements ITestController {
       public functionMap:Function[];
    
       // standard TypeScript constructor
       constructor() {
          this.functionMap = [];
          this.setFatPrototype(this.fatArrowFunction, "fatArrowFunction");
       }
    
       public fatArrowFunction = (arg:string):void => {
          alert("It's fatArrowFunction("+arg+")");
       };
    
       public extendableFunction():void{
          alert("It's extendableFunction()");
       }
       public setFatPrototype(fn:Function, n:string){
          // TODO: look for earlier prototypes that we might need to call
          fn["name"] = n;
          this.functionMap[n] = fn;
       }
       public fatSuper(fnName:string, childArgs:IArguments){
          // TODO: look for earlier prototypes that we might need to call
          var fn;Function;
          if(this.functionMap.hasOwnProperty(fnName)){
             fn = this.functionMap[fnName];
             fn.apply(fn, childArgs);
          }else{
             console.log("fatSuper(): function '"+fnName+"'does not exist on the prototype chain");
          }
       }
    }
  • And here’s the child class:
    export class TestController2 extends TestController implements ITestController2 {
    
       public extendableFunction():void{
          super.extendableFunction();
       }
    
       public fatArrowFunction = (arg:string):void => {
          this.fatSuper("fatArrowFunction", arguments);
          alert("It's fatArrowFunction2("+arg+")");
       };
    }
  • As the comments say, I do not recurse up the ‘prototyp’ tree yet, though that wouldn’t be hard. Before I do that, I need to implement both versions and see if the version that converts all functions to function pointers works with Angular and if it does, to run some tests to see which is faster. Stuff for Monday.

Phil 3.26.15

8:00 – 4:00 SR

  • Tested threejs on target browsers. The hardware acceleration is iffy, but the software renderer and the raytracer work fine
  • Deployed Dong’s FR fixes
  • Working on splitting the chart elements into their own module.
  • Argh! Fat arrow functions can’t inherit in TypeScript! Thinking about making a mapping table? Something like
    • fooPtr = (var:number):void =>{…};
    • fooFn(var:number):void{fooPtr(var);}
    • ????
  • Set up and implemented an interface for calculating behaviors, which works nicely:
  • public behavior = (dClock:number, elapsed:number):void => {
       var rb = this.wglCanvas;
       var ci:IChartElement;
       var i:number = 0;
       if (rb) {
          rb.dprint("Hello controller - sin(elapsed) = " + Math.sin(elapsed).toFixed(2));
          for (i = 0; i < this.chartElements.length; i++) {
             ci = this.chartElements[i];
             ci.setZOffset(Math.sin(elapsed + i));
             ci.behavior(dClock, elapsed);
          }
       }
    };

Phil 3.25.15

8:00 – 5:00 SR

  • Set up Mark’s accounts
  • Set up an admin account for our tester. Not sure if that’s actually needed?
  • Brought over the latest and greatest for Bill to scan. Should be ready for testing tomorrow.
  • Finish integrating Chartinfo class into testbed. Done, but more of an adventure than I was expecting. First, my development box began acting weird (fan noises, flickering graphics, slow performance). Then it BSOD’d. When I finally got it back up, the debugger kept on getting confused about comments. Once that was sorted, I couldn’t get picking to work on area charts, even though it worked fine for everything else. That traced back to a null value for the component name, which is an explicit test I run to manage tooltips. So once the name from the ChartInfo item was loaded into the glComponent, everything began working correctly. Sheesh.
  • Tried to get my laptop again and also a replacement workstation, since this one is now suspect.
  • Running CC

Phil 3.24.15

8:00 – 4:30 SR

  • Lenny’s out for the week. Going to coordinate with Don and Mike(?) for the time being.
  • Need to set up cluster and stacked barcharts. I think it’s mostly a size and offset issue, so there need to be multiple arrays. Since area charts and bar charts pretty much use the same raw data, I think I’ll make a data object that contains the needed data. That can be set by a server call and passed in regardless of the chart type. Cluster bar charts are just offset by the index times the width. The width in turn is the spacing divided by the number of columns and clusters.
  • It strikes me that if we have enough problems having hardware rendering, that we can use raytracing. Either in the server (povray), or using the threejs raytracer. There is no THREE.RaytracingRenderer in definitelyTyped though.
  • Found a bug while making sure that the software rendering looks ok (it does). Fixed. The OrbitControls were resetting the camera origin. I just needed to not set OrbitControls if the scene is not dynamic.
  • Added ChartInfo class that stores all the numbers for a bar chart or area chart. Compiles, will test tomorrow.
  • Burned a disk containing the newest threejs for Bill.

Phil 3.23.15

8:00 – 10:00, 12:00- 5:00 SR

  • Snow flurries are predicted for tomorrow. Some start to spring, huh?
  • Deployed new FR. All seems to be working.
  • Pinged our potential new servers. They respond in half the time and are farther away. I mean like Georgia, I think.
  • Adding bar charts. Once that works, I’ll try to figure out where all the code should go. I also need to talk to Dong about hooking up to a data source.
  • Bar charts are in and working. Need to set them up for ortho2 rendering.

Phil 3.19.15

8:00 – 4:30 SR

  • Worked out a way to calculate the liklihood that a lab will be able to spend it’s money based on past performance. I think it can also be primed with an arbitrary distribution. Need to think about that.
  • Area Charts
    • Added an option to render fastest, which may be needed for Canvas Rendering. Transparency works in SW, which is nice.
    • Adding a method to add to or set the z offset.
    • Added gridlines. Getting close to tying all the pieces together.

nurb-ish