EJSChart

General :: Some questions about EJS

aliasncnu — Fri, 04 Jul 2008 02:45:35 GMT

Hello,
our team have some questions about your great EJC. If most of these questions can be reasonably accepted, we might order it.

1.) Wether you will proivde more events (e.g., mused-clicked) for developers to customze functionality in near future.

2.) One of our clients suggest a feature that users can draw lines on EJS because they would like to implement a tutorial site where teachers can draw some lines to hightlight somethins.

3.) Performance tuning: on a testing PC (single core-1.6Mhz), CPU-resources consumed by IE become almost 80-100% as I tune the # of points in "http://www.ejschart.com/examples/other/dynamicArray.html" to 2000. We would like to know wether you have any strategy on performance tuning.

4) Scroll Bar: that is, EJS's can be wider than the <div> contains it. Hence, users can use scroll bar to nevigate series.

5). What is exact release date of v2.0 and are there any features metioned above implemented in v2.0 ?

Regards,
Ricky.

General :: When using inside of a iframe ejscharts fail in ie

Gonzoga — Thu, 03 Jul 2008 17:20:06 GMT

Hello,

Currently i have set the line chart inside of iframe The line chart will display properly in firefox 2 and firefox 3 also safari, but will not display at all in Internet explorer. the error i get in IE is the data necessary to complete this operation is not yet available.

this is the code that is getting embedded inside of an iframe

'<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><script type="text/javascript" src="http://builder.bungeeconnect.com/ejscharts/EJSChart.js"></script></head><body><div id="myChart1a" style="width:650px; height:530px;"></div></body><script type="text/javascript">var chart = new EJSC.Chart("myChart1a",{show_legend: true,show_messages: false, x_axis_caption: "Timestamp",y_axis_caption: "Values",allow_zoom: false,x_axis_formatter: new EJSC.DateFormatter({ format_string: "NN:SS:ZZZ" }),title: "Prototyping"});chart.addSeries(new EJSC.LineSeries(new EJSC.ArrayDataHandler([[1215104867,9675],[1215104867,9675],[1215104867,17300],[1215104869,9675],[1215104869,9675],[1215104869,9675],[1215104872,9675],[1215104872,423],[1215104871,17300],[1215104871,9675],[1215104874,17300],[1215104879,17300],[1215104881,17300],[1215104886,24410],[1215104887,5481],[1215104889,24410],[1215104890,17300],[1215104891,24410],[1215104893,17300],[1215104897,24410],[1215104905,9675],[1215104905,9675],[1215104907,9675],[1215104907,12276],[1215104908,9675],[1215104905,24410],[1215104912,24410],[1215104914,20824],[1215104915,9675],[1215104915,24410],[1215104916,20824],[1215104919,20824],[1215104920,24410],[1215104922,423],[1215104923,423],[1215104923,423],[1215104925,24410],[1215104928,24410],[1215104935,24410],[1215104939,423],[1215104940,24410],[1215104940,423],[1215104941,423],[1215104941,25353],[1215104942,25353],[1215104942,25353],[1215104943,25353],[1215104947,17300],[1215104964,24410],[1215104965,24410],[1215104966,423],[1215104967,24410],[1215104969,24410],[1215104971,423],[1215104971,423],[1215104973,423],[1215104971,24410],[1215104973,25920],[1215104974,25920],[1215104974,25920]])));</script></html>'

General :: Fix for Analog Gauge Labels reading 'undefined' in 1.3.1

SabatonFan — Thu, 03 Jul 2008 15:33:05 GMT

This might be of use to anyone upgrading to 1.3.1 (in my case, it was from 1.2.1). With the new version, I've noticed immediately that my gauges which were previously rendering without issue now have a label that's coming back as 'undefined'. This was encountered with an AnalogGaugeSeries and an ArrayDataHandler (in my case, there's probably others).

Anyways, I've stepped through the code and noticed that some recent changes seem to be the cause of this.

If you're getting this problem and have access to the source, so a search for
"// JHM: 2008-06-05 - Modified to account for pie and gauge series which do not have y axis values".
If you compare the code for setting y_string_values and a little later for this.__data[p][1], you'll see that a regular expression is being applied to the owner type, specifically

Code:

this.__owner.__type.match(/pie|gauge/) == null)

I've found that if I change the comparison operator to '!=' rather than '==', my gauges render as they did previously and without issue. I'm close to a release date so I don't have tons of time to test whether there are other impacts to making the change, but it doesn't seem to break anything else in my project (it's possible there are other impacts).

If someone from Emprise could offer insight as to whether I'm using the wrong code to draw my gauges, I'd appreciate it..

Sample:

Code:

Pardon the extraneous javascript, I've included it on the odd chance that it might have an impact...

General :: EJS Charts Interactiveness 101

Dragon — Wed, 02 Jul 2008 18:09:11 GMT

Hello,

We just found EJS Charts as a tool and are currently reading on it's strengths and features. Simply put, our team is pretty much enthused by it's being light weight and it's ability to deliver rich graphical information.

We were wondering if we could get our hands on some suggestive sample codes on how to extract relevant information from the charts themselves, e.g. interactive APIs and how to use them. Are there snippets perhaps out there that we can feed in our research? We checked out the sample codes provided and it seems like they're expounding more on the means to properly render the charts.

Would appreciate all the help and thanks in advance.

Best Regards,

General :: Analog gauge bug in IE6 & IE7

dyu — Wed, 02 Jul 2008 12:55:22 GMT

Analog gauge throws runtime exceptions when element containing the chart gets removed from its dom parent.

Is this a known bug? Has there been a fix for this?
Note that this doesnt happen on other browsers cept ie6 & ie7

Future :: Chart Notes

Ted — Mon, 30 Jun 2008 16:55:59 GMT

I would like the ability to create "Note" objects that are some what analagous to the existing series objects. The constructor would require an x value, a y value and text with an optional title (caption?), className, etc. Each note, like a series would be automtically numbered. A dot would be placed on the chart at the point referenced by the note object and an entity would be drawn near by. It could look like the hint, showing the caption and having an arrow pointing at the dot but I would think that a small circle with the (foot)note number inside it located near the dot would be sufficient, perhaps preferable. Both could be supported using a property to specify which style is wanted. Hovering over the marker would cause the note to be displayed, leaving the marker would cause the note to disappear.

An entity similar to the current "series legend" would be created when note objects are added to a chart. It would have an overloadable title of "Notes". It could be dragged, maximized and minimized, just like the current legend. The note number followed by the caption would appear in the list. Clicking[hovering?] on a list item would allow the text of that note to be read.

Even though it is not officially supported by Emprise, I position, minimize, maximize, show and hide the existing "series" legend using code. I would expect to do the same things for the footnote legend using a published API.

I would believe that I can create this facility and overlay a chart with it using the existing API, in particular the doAfterDraw event and the convertPointToPixel method but a little help from Emprise would go a long way.

Future :: "Scale" property for the number formatter

Ted — Sat, 28 Jun 2008 18:56:40 GMT

I am sure that I can do this by creating a custom number formatter but if enough people would use it, I think that it would be trivial to ad to the default number formatter. That would be the ability to add a property, perhaps named "Scale" to this object. The data value would be multiplied by this factor and rounded before the number was formated. This is common in financial reporting. Some times the numers are scaled in dollars, sometimes in thousands of dollars, sometimes in millions and sometimes in billions. There are many reasons why I want to load the series with the actual values and only scale the values when formatting the captions. One is that I can put a drop down and let the user select the scale and redraw the map without having to recreate the series with scaled numbers.

General :: Dates output on graph do not match dates input via array.

carnage — Thu, 26 Jun 2008 08:39:25 GMT

I am having problems with dates with EJSChart. I made a sample html which shows the problem. Basically the dates I put in via my array series DO NOT match the dates output on the graph. Not even close. I really want to use this software but I cannot resolve this problem. Any help appreciated,

Adam.

Example html follows:
+-----

<HTML>
<HEAD>
<title>Date Test</title>
<script type="text/javascript" src="./EJSChart/EJSChart.js"></script>
</HEAD>
<body class="wholepage" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
<div id="content-wrap">
<div id="main">
<h1>Date Test Showing Bad Dates in Chart...</h1>
<div class="onecolumn">
<div class="default">
<h2 class="result">Notice that the dates on the graph do not match those passed via the array.</h2>
<div id="buildTimesChart" style="width:800px; height:330px;" class="chart">
</div>
</div>
</div>
<script type="text/javascript" id="buildTimesScript">
var chart = new EJSC.Chart( 'buildTImesChart' , {
show_mouse_position: false,
x_axis_size: 30,
x_axis_caption: "Date" ,
y_axis_caption: "Time" ,
show_crosshairs:{x:true,y:true},
x_axis_formatter:new EJSC.DateFormatter({format_string:"DD/MM<br>YYYY"})
});

var ary = [];

ary.push( [ ((new Date(2008,06,23)).getTime()) , 14.59 ] );

ary.push( [ ((new Date(2008,06,24)).getTime()) , 14.31 ] );

ary.push( [ ((new Date(2008,06,25)).getTime()) , 14.43 ] );

var arraySeries = new EJSC.LineSeries(
new EJSC.ArrayDataHandler( ary ) ,
{ autosort: false }
);

chart.addSeries(arraySeries);

</script>
</div>
</div>

<div id="code">
<br>
If you View Source you can see that the dates do not match those output on the graph...ie.<br>
ary.push( [ ((new Date(2008,06,23)).getTime()) , 14.59 ] ); <br>
ary.push( [ ((new Date(2008,06,24)).getTime()) , 14.31 ] ); <br>
ary.push( [ ((new Date(2008,06,25)).getTime()) , 14.43 ] ); <br>
</div>
<div id="output">
Below is an image of what I get as output...<br>
<img src="datetestoutput.jpg" border="0"/>
</div>
</body>
</HTML>

+------

I tried to include a test image showing the problems but this forum doesn't let me attach any files.

Is there a private support channel I could send this to?

I went to trouble of adding EJSChart to my Cruisecontrol.NET setup already so I would REALLY like to fix this.

Cheers,

Adam.

[img][/img]

General :: xAxis without Weekend

ruiguarda — Wed, 25 Jun 2008 10:55:24 GMT

It is possible to build a chart that represents a week without the weekend. I'm trying but i think is not possible.
can anybody help me.

General :: XMLDataHandler not included in this edition??

carnage — Wed, 25 Jun 2008 09:37:21 GMT

I just started toying with the evaluation and wrote this simple html file...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Using Dates</title>
<script type="text/javascript" src="C:\testhtml\EJSChart\EJSChart.js"></script>
</head>

<body>

<div class="onecolumn">
<div class="default">
<h2 class="result">WTF</h2>

<div id="myChart" style="width:800px; height:330px;" class="chart"></div>
</div>
</div>

<script type="text/javascript">
var chart = new EJSC.Chart("myChart", {
show_legend: false
});

chart.addSeries(new EJSC.LineSeries(
new EJSC.XMLDataHandler(
"c:\testhtml\data.xml"
)
));
</script>

</body>

</html>

where data.xml contains:

<G>
<L>
<P x="1" y="1" />
<P x="2" y="2" />
<P x="3" y="3" />
<P x="4" y="4" />
<P x="5" y="5" />
<P x="6" y="6" />
<P x="7" y="7" />
<P x="8" y="8" />
</L>
</G>

When I double-click on this html file I get a dialog saying:

"EJSC.XMLDataHandler is not included in this edition of Emprise JavaScript Charts." (OK).

Does this mean that the XML File Data Handler is not included in the trial version of the software?

Also - I want to write my XML with dates for the key(x) values in the series. My program is in C#. Does anyone know how to write the date format correctly within the XML and/or a function in C# for writing the date in the format expected by EJSC?

In general there are not enough examples for this software showing how to use the date formatter. An example with code + data similar to that on the front web-page would be appreciated.

Cheers,

Adam.