473,837 Members | 1,541 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Binary I/O in Javascript



Has anyone written code that successfully manipulates binary file data
using Javascript?

It might---and in the case of doing I/O, will---make use of browser-
specific functions (ActiveX/COM with Internet Explorer, XPCOM/XPConnect
with Mozilla/Firefox).

I am writing client-side code that will generate binary data for producing
a GIF file through an OBJECT element. (The GIF is an image of a line and
points on a two-axis plot.)

In order to do some tests to see how the OBJECT element performs, I am
trying to read in binary file data (using XPConnect functions in Firefox).

The problem is that plain Javascript and these browser-specific functions
will not marry with one another (for instance, they cannot be manipulated
as strings, and the read() functions of these things return strings as
well). This is from what little I know. Dated posted in various
newsgroups on the subject get comments saying that if those creating file
I/O libraries in client-side code for text file I/O might as well make it
possible for manipulating binary data in I/O, since the point of no return
is authorizing any access to the file system, and not whether it is text or
binary access.

If I don't get an answer here, I will take this to the JScript and XPCOM
groups, where I can hope for more from the latter than the former. If it
can't be done in MSIE though, I suppose I should forget it (and try to
write a plugin of some kind instead). Unless I hear that MSIE browsers are
being used by less than 100,000 people around the world.
Nov 23 '05
26 4338
"Kevin" <kd******@basit .com> wrote in
news:11******** *************@o 13g2000cwo.goog legroups.com:
Patient Guy wrote:
Has anyone written code that successfully manipulates binary file
data using Javascript?


What do you mean by manipulate? Concatenate segments? Add binary
numbers? Save or load to/from disk? Or ???
I am writing client-side code that will generate binary data for
producing a GIF file through an OBJECT element. (The GIF is an image
of a line and points on a two-axis plot.)


I'd like to help, but why do you need to pass binary data to a plot
object?

Just trying to get a grip on what you're after.


Suppose you want to render an x-y plot showing, for instance, a
calibration curve. This is very common in any natural science discipline.

Now how do you do it with the tools you have for doing it on a web page?

First I create an user interface using the HTML form elements: the user
enters their abscissa-ordinate data in textboxes and then clicks a button
to do any stastistical work (least-squares for a line fit, maybe
polynomial fit, or other kind). You then want a VISUAL display (not just
tabular) of the plots and any fitted lines. How would you do that?

1. There are text (ASCII char) representations using dashes/hyphens, plus
symbols, 'x' characters, and other sorts of stuff, usually loaded into a
PRE element created. But that often looks rather bad. Easily done, but
poor appearance.

2. The alternative is to use script to manipulate data to create a
properly formatted image file to render the plot. The appearance is
stunningly much better. The GIF is the most suitable form for images that
are not photographs (as a plot is). An OBJECT element is created
dynamically, its 'type' attribute set (='image/gif') and its 'data'
attribute then set with encoded binary (the encoding is likely to be
base64). For perhaps a 700 x 400 pixel gif image of a plot, we're talking
about maybe 2K bytes of data, right? Not too much for a script engine to
work through in a decent amount of time.

The problem is that core Javascript----from apparently what little I know
of it---- does not seem to work with binary data too well.

Actually, I should not say that. I believe that you can work with Array
objects with each element specified as a Unicode char. One poster in this
thread seems to be saying that very thing.

But I want to do some testing with file I/O, and the file I/O library
functions for the most-used browsers I know of (the ActiveX
FileSystemObjec t, Mozilla/Firefox XPCOM/XPConnect) have read() and write()
functions that only seem to work with String objects, and the characters
allowed in a string object are limited; if some outside the ASCII charset
are allowed, the char '\u0000' (or '\x00') is one used by the script to
know when to terminate strings.

There are clearly other individuals who have experimented more with what
core Javascript can do than I have done, and I am trying to learn from
them what they have learned. One poster in this thread has developed a
library, and from reading through his code, I will see what he has
learned. But I want to see if this poster has dealt with the file I/O
problem, and how he has gotten round it. I will put this question to the
groups who know about ActiveX FSO and XPCOM. I also want to include any
other browser-specific code for other browsers (Opera, whatever) with
possibly their own interfaces for dealing with file I/O in binary, unless
they add as interfaces those of the major browsers.

The suggestion to use vector graphics (SVG, a W3C "recommendation ") is
probably the way I should go, although clearly (not all) the major
browsers do not have built-in component to render this type of object
(i.e., requires a plug-in). I will be delayed for a time browsing through
a 700-page SVG specification to learn what it is I need to do make that
rendering.
Nov 23 '05 #11
On Tue, 15 Nov 2005 06:06:06 GMT, Patient Guy
<Pa*********@no where.to.be.fou nd.com> wrote:
The suggestion to use vector graphics (SVG, a W3C "recommendation ") is
probably the way I should go, although clearly (not all) the major
browsers do not have built-in component to render this type of object


No, I didn't recommend SVG, I recommended vector graphics, there are
non-plugin vector graphics available in all the latest versions of the
4 largest browsers, add in plug-ins and you'll support all the desktop
browsers released in the last 4 years.

Certainly the coverage is much larger than file access (opera has none
for example) and it will be much, much faster than a GIF generator in
javascript.

Jim.
Nov 23 '05 #12
VK

Patient Guy wrote:
The suggestion to use vector graphics (SVG, a W3C "recommendation ") is
probably the way I should go, although clearly (not all) the major
browsers do not have built-in component to render this type of object
(i.e., requires a plug-in). I will be delayed for a time browsing through
a 700-page SVG specification to learn what it is I need to do make that
rendering.


My advise was to use the combination of
VML (Vector Markup Language) build into all supported versions of
Internet Explorer and
SVG (Scalable Vector Graphics) build into incoming version of Firefox
1.5 and having a bunch of plugins to hold on now. You may look what
Internet Explorer can to by default for a longest time here:
<http://www.geocities.c om/schools_ring/archives/VML_SVG.html>
<http://www.geocities.c om/schools_ring/archives/VML_SVG.zip>

Both VML and SVG are rather easy to understand (especially VML)
Unfortunately Microsoft did a big mistake: they right away announced
VML as open standard and filed standard proposal papers to W3C under
their name. This alone ensured that W3C did not accept VML and started
to develop another standard (SVG)
And Mozilla Foundation accepts only W3C signatures and Microsoft
doesn't give a damn about W3C relevations and.. any way, there are two
standards now we have to deal with.
Next time Microsoft should use some 3rd party bogus company to file
standards to W3C - they will have much more chance to pass through :-)

VML and SVG are still pretty close: really, vector is vector and line
is line, whoever's describing them. VML is more evident and user
friendly.
SVG is based on VRML project and inherits its academical look and
confusing coordinates notation. But the ability to go away from ASCII
pseudo-graphics and from micro DIV's chaos pays for troubles to learn
both.
IMHO

Nov 23 '05 #13
> My advise was to use the combination of
VML (Vector Markup Language) build into all supported versions of
Internet Explorer and
SVG (Scalable Vector Graphics) build into incoming version of Firefox
1.5 and having a bunch of plugins to hold on now. You may look what
Internet Explorer can to by default for a longest time here:
<http://www.geocities.c om/schools_ring/archives/VML_SVG.html>
<http://www.geocities.c om/schools_ring/archives/VML_SVG.zip>


Great stuff.

Thanks I was not aware of VML.

Aaron


Nov 23 '05 #14
VK

Julian Turner wrote:
I have been experimenting myself,


Julian, did you keep your testcases? If so, could you give me some?

Nov 23 '05 #15
VK
.... not for criticism of any kind, I'd just like so save some of my
time/

Nov 23 '05 #16
>There is Walter Zorn's div based JavaScript graphics :-
http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm


Wow! Neat link, I've been looking for something along these lines for
ages.

Nov 23 '05 #17
> >There is Walter Zorn's div based JavaScript graphics :-
http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm


Wow! Neat link, I've been looking for something along these lines for
ages.


Beware every dot is a <div> :)

VML and SVG are better solutions but not as portable as Walters solution.

Google for VML and SVG they are specs on W3C website.

VML runs in IE 5.0+. There are FireFox plugins but for SVG the latest beta
has SVG built in.

VML is easier to program than SVG, but SVG is more comprehensive.

Aaron
Nov 23 '05 #18

Aaron Gray wrote:
There is Walter Zorn's div based JavaScript graphics :-
http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm


Wow! Neat link, I've been looking for something along these lines for
ages.


Beware every dot is a <div> :)

VML and SVG are better solutions but not as portable as Walters solution.

Google for VML and SVG they are specs on W3C website.

VML runs in IE 5.0+. There are FireFox plugins but for SVG the latest beta
has SVG built in.

VML is easier to program than SVG, but SVG is more comprehensive.

Aaron


Thanks, :-)

Nov 23 '05 #19
Patient Guy wrote:
"Kevin" <kd******@basit .com> wrote in
news:11******** *************@o 13g2000cwo.goog legroups.com:
Patient Guy wrote:
I am writing client-side code that will generate binary data for
producing a GIF file through an OBJECT element. (The GIF is an image
of a line and points on a two-axis plot.)
I'd like to help, but why do you need to pass binary data to a plot
object?


[...]
2. The alternative is to use script to manipulate data to create a
properly formatted image file to render the plot. The appearance is
stunningly much better. The GIF is the most suitable form for images that
are not photographs (as a plot is). An OBJECT element is created
dynamically, its 'type' attribute set (='image/gif') and its 'data'
attribute then set with encoded binary (the encoding is likely to be


Ah. I had misread your first posting, thinking you already had written
an ActiveX display or plotting object. So I couldn't figure out why
you wouldn't simply pass the plot parameters as text or numbers to that
object for display generation.

For example, I did an ActiveX signature control that is used for both
capture and display. You get and set compressed vector data (as a
string) to draw lines or whatever.

But you can't just create an HTML element of type OBJECT and expect it
to know how to display (or do) anything. So if your idea was to
create GIF data and pass it to an inanimate element of type OBJECT,
nothing would happen. Unless there's some magic OBJECT I don't know
about.
[...]
But I want to do some testing with file I/O, and the file I/O library
functions for the most-used browsers I know of (the ActiveX
FileSystemObjec t, Mozilla/Firefox XPCOM/XPConnect) have read() and write()
functions that only seem to work with String objects, [...]
This is what I thought your original Q was about... reading in binary
test data to pass to an ActiveX object. For that, you could use
XMLHTTP to read in a file://, and pass its responseBody as binary data
into a control.
The suggestion to use vector graphics (SVG, a W3C "recommendation ") is
probably the way I should go, although clearly (not all) the major


I like SVG myself, and have done some complicated, rotating and moving
gizmos under it. Google around and you should be able to find sample
SVG code for plotting graphs... a very popular use for SVG.

If it's just simple graphing, though, you could get away with using
DIVs / tables and CSS to create some nice images. Bar graphs easiest,
of course, but the finer grain you go, the more it'd look like a line,
too.

Luck!
Kevin

Nov 23 '05 #20

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

17
5677
by: joealey2003 | last post by:
Hi all... I need to load an image, access it's content and render it. So, tried: <script type="text/javascript"> xmlHttp = new XMLHttpRequest();
9
6558
by: J.Sperlhofer | last post by:
Good morning, Javascript-Professionals. I'm looking for an possibility to show a (calculated) 64bit-Number without exponential notation. I don't want to see exponational notation within my binary numbers. To demonstrate my problem, try this code: ---- var binNumber = Math.pow(2,61);
4
4293
by: CSharpener | last post by:
This should be *so* easy! How do I convert a Byte or int to a binary string representation in C# In JavaScript, it goes like this for an int: javascript:(123).toString(2 or javascript:(0xFE).toString(2 No problem. So, how do I do the same in C#? What simple thing am I missing
4
8330
by: dirtside | last post by:
I've search far and wide for an answer, so forgive me if this is a stupid question. (Well, it probably is.) Consider the following JavaScript: var foo = new Image(); foo.src = "http://some.server.com/some_filename.gif"; Now, the browser will retrieve 'some_filename.gif' from some.server.com and put it into the object foo. What I want to do is then subsequently
9
6307
by: GiantCranesInDublin | last post by:
Hi, I am looking for the best performing solution for modifying and iterating an object graph in JavaScript. I have outlined below a simplified example of the object model and examples of how I will be using this graph. Object model:
15
9823
by: mleaver | last post by:
I want to open a second window and display a binary image that is returned from a java program via XMLRPC. The data returned is a binary encoded base64 png file. If I write the data out to a file on my server, I can display it using the following javascript: var windowHandle = window.open('about:blank','windowName','width=250,height=250'); windowHandle.document.write('<img name="myImage" src="images/test.png">');
7
2868
by: robert.differentone | last post by:
Hi, Does anybody know any javascript which converts images into binary data. Thanks in advance, R.
3
8545
by: Billy Smith | last post by:
I'm trying to write a little utility that will write some binary data to a file via a javascript and Windows Script Host under Windows XP. The only way to do this that I can find is to convert the binary data to text via String.fromCharCode() function and then write to the file with TextStream.Write(). But that function gives an "invalid parameter" error message when I try to write some ASCII codes to the file. I could understand if...
0
28085
Frinavale
by: Frinavale | last post by:
Convert a Hex number into a decimal number and a decimal number to Hex number This is a very simple script that converts decimal numbers into hex values and hex values into decimal numbers. The example following this one demonstrates how to convert decimal numbers into binary values. A hex number is a string that contains numbers between 0-9 and characters A-F; where A = 10, B = 11, ..., F = 15. (For more information please look up...
0
10871
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10564
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
10621
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
9396
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7806
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
6998
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5668
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
4474
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
4039
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.