new to steema need help with 3dcharts

TeeChart for JavaScript for the HTML5 Canvas
Post Reply
sct
Newbie
Newbie
Posts: 31
Joined: Tue Aug 06, 2013 12:00 am

new to steema need help with 3dcharts

Post by sct » Tue Aug 06, 2013 1:54 pm

Hello, I have made a few application with the trial api and have decided to purchase. I copy over the new download with the latest version. Lots of area confuse me a bit so I will list them all sequentially.

1)how to despose of a chart? I can not figure out how to properly dispose of a chart and not sure its needed. What I do for now is just remove the canvas ( ....removeChild( canvas01 ); )

2)how to use an array without eval'ing it?
The following works.
surface.data.labels = eval( "[" + this.Xdata.toString() + "]" );
surface.data.labels = new Array(...)
this does not
surface.data.labels = this.Xdata
Xdata is defined as an array, why does that not work( map is empty)?

3) Can not make a 3rd dimension label? Looking at the 3dchart as it is without moving it. I can label X and Y but not Z?

4) Can the 3d charts support movable points? If not can this be added somehow?

5)where is the complete api? I dont see "Tee.Three" in the Class Index for example. There is so much that is not document ?

6) browsers
-- does not work on opera error: Error thrown at line 30, column 50 in <anonymous function: clearRect>() in http://localhost:62578/SCT/steema/src/teechart-3d.js:
-- does not work in IE 10: Unable to get property 'add' of undefined or null reference teechart-3d.js, line 30 character 51
-- does not work in safari: no idea why, cant find debug messages.

I'm very impressed with the charting so far, hope you can assist with the above!

Yeray
Site Admin
Site Admin
Posts: 9514
Joined: Tue Dec 05, 2006 12:00 am
Location: Girona, Catalonia
Contact:

Re: new to steema need help with 3dcharts

Post by Yeray » Fri Aug 09, 2013 1:24 pm

Hello Sean,

This is just to let you know we haven't forgotten you. We are investigating some of the doubts you've asked for and we'll come back with a reply as soon as possible.
Best Regards,
ImageYeray Alonso
Development & Support
Steema Software
Av. Montilivi 33, 17003 Girona, Catalonia (SP)
Image Image Image Image Image Image Please read our Bug Fixing Policy

Yeray
Site Admin
Site Admin
Posts: 9514
Joined: Tue Dec 05, 2006 12:00 am
Location: Girona, Catalonia
Contact:

Re: new to steema need help with 3dcharts

Post by Yeray » Wed Aug 14, 2013 8:07 am

Hi,
sct wrote:1)how to despose of a chart? I can not figure out how to properly dispose of a chart and not sure its needed. What I do for now is just remove the canvas ( ....removeChild( canvas01 ); )
As far as we know, there's no function to manually dispose memory in JavaScript. There's a garbage collector that should release the memory a variable uses when it finds it won't be used any more.
If you want, you can take a look at the details of the memory that is being used with the developer tools or similar
https://developers.google.com/chrome-de ... -profiling
sct wrote:2)how to use an array without eval'ing it?
The following works.
surface.data.labels = eval( "[" + this.Xdata.toString() + "]" );
surface.data.labels = new Array(...)
this does not
surface.data.labels = this.Xdata
Xdata is defined as an array, why does that not work( map is empty)?
If Xdata is an array of numbers, you could do as follows:

Code: Select all

var result=[];
for (var i=0,l=this.XData.length;i<l;i++) result.push(this.XData[i].toString());

surface.data.labels = result;
sct wrote:)3) Can not make a 3rd dimension label? Looking at the 3dchart as it is without moving it. I can label X and Y but not Z?
I'm afraid there's no depth axis in TeeChart JavaScript yet. This is a feature to be added in a future release with the possibility to have 3D non-orthogonal charts without WebGL.
sct wrote:4) Can the 3d charts support movable points? If not can this be added somehow?
I'm afraid not at the moment. I'll add this to the wish list to be implemented in future releases (TF77016688).
sct wrote:5)where is the complete api? I dont see "Tee.Three" in the Class Index for example. There is so much that is not document ?
I've updated the link to the API in the Specifications tab in the TeeChart HTML5 page to point to the latest version of the API. The Three section isn't finished but at least you'll be able to see the structure.
sct wrote:6) browsers
-- does not work on opera error: Error thrown at line 30, column 50 in <anonymous function: clearRect>() in http://localhost:62578/SCT/steema/src/teechart-3d.js:
-- does not work in IE 10: Unable to get property 'add' of undefined or null reference teechart-3d.js, line 30 character 51
-- does not work in safari: no idea why, cant find debug messages.
You have to add the following to go back to HTML5 canvas when WebGL isn't supported in the browser. This code can be found in the webgl demos and an explanation can be found here.

Code: Select all

  if (three.isEnabled()) {
    Chart1.draw();
    animate();
  }
  else
  {
    // Show message (WebGL not available) :
    Detector.addGetWebGLMessage();

    // Disable WebGL and use HTML5 2D Canvas:
    three.setEnabled(false, Chart1);
  }

  // Loop
  function animate() {
    three.update();
    requestAnimationFrame( animate );
  }
Don't hesitate to let us know if you still find problems with any of the above.
Best Regards,
ImageYeray Alonso
Development & Support
Steema Software
Av. Montilivi 33, 17003 Girona, Catalonia (SP)
Image Image Image Image Image Image Please read our Bug Fixing Policy

sct
Newbie
Newbie
Posts: 31
Joined: Tue Aug 06, 2013 12:00 am

Re: new to steema need help with 3dcharts

Post by sct » Wed Aug 14, 2013 12:14 pm

Yeray, I'm aware of the GB collection and agree there should never be a need for that. I was more concerned about the code on your end and if there was a need for it. That clears up the question for me.
If Xdata is an array of numbers, you could do as follows:
My work around with eval works I'm just so baffled as to why this works:
surface.data.labels = new Array(...)
and this does not
surface.data.labels = this.Xdata
?
This is a feature to be added in a future release
As long as its on the todo that works for us ;)

TF77016688 -- looking forward to that.
You have to add the following to go back to HTML5 canvas when WebGL isn't supported in the browser. This code can be found in the webgl demos and an explanation can be found here.
I saw this reference and I used it like so.

Code: Select all

    if ( three.isEnabled() )// Valid webGL ?
             {
                 this.Chart1.draw();
                 animate();
             }
             else
                 alert("error: NO WEBGL SUIPPORT")

             function animate()// Loop
             {
                 three.update();
                 requestAnimationFrame( animate );
             }

I put this code in my 3d draw but I get the errors I mentioned before during my 2d draw before I ever attempt the 3d. Interestingly I never see this alert. It's bit hard to follow "go back" to since in my cause I can not get to the 2d map to start with, without errors . Maybe I dont quite follow yet. Do I need this check for my 2d map before I ever attempt a 3d map?

sct
Newbie
Newbie
Posts: 31
Joined: Tue Aug 06, 2013 12:00 am

Re: new to steema need help with 3dcharts

Post by sct » Fri Aug 16, 2013 1:28 pm

I fixed the array issue by doing this. ( I hope is ok to share source on this board ? )

Code: Select all

Tee.Series.prototype.valueText=function(index) {
      var vv=this.data._old || this.data.values, d=vv[index];
	  if ( typeof d == "string") d = Number(d);
      if (d) {
...

Yeray
Site Admin
Site Admin
Posts: 9514
Joined: Tue Dec 05, 2006 12:00 am
Location: Girona, Catalonia
Contact:

Re: new to steema need help with 3dcharts

Post by Yeray » Tue Aug 20, 2013 7:45 am

Hi,

Thanks for the comments and for sharing the solution to the array problem.
Best Regards,
ImageYeray Alonso
Development & Support
Steema Software
Av. Montilivi 33, 17003 Girona, Catalonia (SP)
Image Image Image Image Image Image Please read our Bug Fixing Policy

sct
Newbie
Newbie
Posts: 31
Joined: Tue Aug 06, 2013 12:00 am

Re: new to steema need help with 3dcharts

Post by sct » Tue Aug 20, 2013 1:39 pm

I'm not having luck with the setEnabled. I tried to put it in various places and either I get a ghost 3d map or d.parentElement is null. This is how I currently do my 2d 3d switching. How would you recommend I do the setEnabled?

Code: Select all

chart.prototype.draw3d = function()
     {//makes a 3d chart
         if ( this.Zdata == "" ) return;//no data to make a chart.
         this.UIDiv.removeChild( this.canvas );
         this.canvas = document.createElement( 'canvas' );
         this.canvas.id = "canvas" + this.id;
         this.canvas.width = this.canvasData_width;
         this.canvas.height = this.canvasData_height;
         this.canvas.style.zIndex = this.canvasData_zIndex;
         this.canvas.style.background = "#666677"
         this.UIDiv.appendChild( this.canvas );

         var Chart3d = new Tee.Three( "canvas" + this.id );// Create 3D WebGL context:
         this.Chart1 = new Tee.Chart( Chart3d );// Create Chart:
         this.Chart1.walls.visible = false;
         this.Chart1.title.text = "Rotate with left click, scrole to zoom.";
         surface = new Tee.Surface();// Create Surface:
         this.Chart1.addSeries( surface );// Add Surface series to Chart:

         var makeData="[[";//make data
         for ( var d = 0; d < this.Zdata.length ; d++) makeData += this.Zdata[d] + "],[";//formate string
         surface.data.values = eval( makeData.substring( 0, makeData.length - 3 ) + "]]" )
         surface.data.labels = this.Xdata;//eval( "[" + this.Xdata.toString() + "]" );
         surface.grid.visible = true;
         Chart3d.toogle( this.Chart1.walls, false );
         Chart3d.floor.visible = false;
         if ( Chart3d.isEnabled() )// Valid webGL ?
         {
             this.Chart1.draw();
             animate( );
         }
         else
             alert( "NO WEBGL" )

         function animate( )// Loop
         {
             Chart3d.update();
             requestAnimationFrame( animate );
         }
         this.Chart3d = Chart3d;//save to class
     }

     chart.prototype.draw = function ()
     {//makes a 2d chart              
         this.UIDiv.removeChild( this.canvas );
         this.canvas = document.createElement( 'canvas' );
         this.canvas.id = "canvas" + this.id;
         this.canvas.width = this.canvasData_width;
         this.canvas.height = this.canvasData_height;
         this.canvas.style.zIndex = this.canvasData_zIndex;

        // this.canvas.style.background = "#ffffff"
         this.UIDiv.appendChild( this.canvas );
         this.Chart1 = new Tee.Chart( "canvas" + this.id );

         this.annot = new Tee.Annotation( this.Chart1 );
         this.annot.position.x = 15;
         this.annot.position.y = 20;
         var anno = this.annot
         this.annot.mousemove = function () { this.text = ""; }

         if ( this.type == "Function" )  this.addData( this.Xdata, this.Ydata, .05, "ellipse" );
         else if ( this.type == "Table" )
         {
             for ( z = 0; z < this.Zdata.length;z++ )
             {
                 this.addData( this.Ydata, this.Zdata[z], .05, "ellipse" );
             }
         }

         //this.Chart1.legend.textStyle = "values"
         //this.Chart1.legend.legend_textstyle = "label"

         this.Chart1.tools.add( this.annot );

         this.Chart1.title.text = "";
         this.Chart1.axes.left.title.text = this.labelY;
         this.Chart1.axes.bottom.title.text = this.labelX;
         this.Chart1.tools.add( new Tee.DragTool( this.Chart1 ) );
         this.Chart1.draw();
     };

sct
Newbie
Newbie
Posts: 31
Joined: Tue Aug 06, 2013 12:00 am

Re: new to steema need help with 3dcharts

Post by sct » Tue Aug 20, 2013 2:04 pm

more info on the IE issue. Here is the error no that I have the source code.
Attachments
error.png
error.png (137.08 KiB) Viewed 23419 times

Yeray
Site Admin
Site Admin
Posts: 9514
Joined: Tue Dec 05, 2006 12:00 am
Location: Girona, Catalonia
Contact:

Re: new to steema need help with 3dcharts

Post by Yeray » Mon Aug 26, 2013 11:45 am

sct wrote:I'm not having luck with the setEnabled. I tried to put it in various places and either I get a ghost 3d map or d.parentElement is null. This is how I currently do my 2d 3d switching. How would you recommend I do the setEnabled?
Note you have to add the helvetiker_regular.typeface.js and three.min.js scripts besides to the teechart-3d.js to make it run.
Best Regards,
ImageYeray Alonso
Development & Support
Steema Software
Av. Montilivi 33, 17003 Girona, Catalonia (SP)
Image Image Image Image Image Image Please read our Bug Fixing Policy

sct
Newbie
Newbie
Posts: 31
Joined: Tue Aug 06, 2013 12:00 am

Re: new to steema need help with 3dcharts

Post by sct » Mon Aug 26, 2013 12:04 pm

I have the 5 included.

steema/demos/canvas/webgl/threejs/three.min
steema/demos/canvas/webgl/fonts/helvetiker_font/helvetiker_regular.typeface.js
steema/source/teechart.js
steema/source/teechart-extras.js
steema/source/teechart-3d.js

Yeray
Site Admin
Site Admin
Posts: 9514
Joined: Tue Dec 05, 2006 12:00 am
Location: Girona, Catalonia
Contact:

Re: new to steema need help with 3dcharts

Post by Yeray » Tue Aug 27, 2013 3:38 pm

Hi,

And are the correctly loaded?
Please, check the demos included with the installation. If the WebGL examples work fine for you locally, you just have to do the same in your page.
Best Regards,
ImageYeray Alonso
Development & Support
Steema Software
Av. Montilivi 33, 17003 Girona, Catalonia (SP)
Image Image Image Image Image Image Please read our Bug Fixing Policy

sct
Newbie
Newbie
Posts: 31
Joined: Tue Aug 06, 2013 12:00 am

Re: new to steema need help with 3dcharts

Post by sct » Wed Aug 28, 2013 12:31 pm

Everything is the same for includes. When I use the demo in IE,opera, safarI just get a grey blank map. Unfortunately dont get errors. FF is the only browser that for for me.

Yeray
Site Admin
Site Admin
Posts: 9514
Joined: Tue Dec 05, 2006 12:00 am
Location: Girona, Catalonia
Contact:

Re: new to steema need help with 3dcharts

Post by Yeray » Thu Aug 29, 2013 11:24 am

This depends on the browser:
http://caniuse.com/webgl
Best Regards,
ImageYeray Alonso
Development & Support
Steema Software
Av. Montilivi 33, 17003 Girona, Catalonia (SP)
Image Image Image Image Image Image Please read our Bug Fixing Policy

Post Reply