[XML-DEV Mailing List Archive Home] [By Thread] [By Date] [Recent Entries] [Reply To This Message]

RE: Using pre-arranged arrays to render charts

  • To: "'Stephen E. Beller'" <sbeller@n...>, xml-dev@l...
  • Subject: RE: Using pre-arranged arrays to render charts
  • From: "Bullard, Claude L (Len)" <clbullar@i...>
  • Date: Tue, 2 Mar 2004 15:49:34 -0600

vml org chart
The example I gave of a VML file is simply a rendering 
of a database generated document.  It isn't interactive. 
It is just a prototype to demonstrate VML to some 
other interested parties who make not downloading a 
plugin a requirement.

Although one can use Javascript to get and set the 
values, that is likely harder than writing an XSLT 
script to do the main work of laying out the source 
file if XML, and then using Javascript to do the 
interactive work via the browser DOM.

VML is only supported in Internet Explorer.  For 
what you have in mind, Scalable Vector Graphics 
(SVG) is probably the better language to use for 
rendering.  There is lots of source out there 
to pickover.   The only downside is requiring a 
plugin and working through its API instead of the 
browser DOM.

len


From: Stephen E. Beller [mailto:sbeller@n...]

Thanks ... You guys are great!

I can see how the layout generator would be challenging. 

One question I still have is how I can replicate the functionality of an
interactive chart in which I select a subset of an array for rendering. Say,
for example, I have 20 retail stores with monthly sales data across several
years, which are broken down by customer. I first want to view the sales
data of a particular store for a specific year. Then I want to view the same
data broken down customers. Then I want to view all stores ... etc. There
could be thousands of different views.

My current method is to select particular "ranges" of data in the arrays
(stored in the CSV file) and render them as bar graphs. I don't know how the
method below would do it?

I may be asking XML to do too much in this case. Is there some kind of
JavaScript called from and XML file, or an IE plug-in, or some other way to
access pre-configured arrays, possibly stored in an external text file, and
apply appropriate parsing and rendering routines to display the chart in a
browser?

Steve


-----Original Message-----
From: Bullard, Claude L (Len) [mailto:clbullar@i...] 
Sent: Tuesday, March 02, 2004 3:01 PM
To: 'Thomas B. Passin'; xml-dev@l...
Subject: RE:  Using pre-arranged arrays to render charts

That's easy. See below.  Run's without a plugin right there 
in the HTML.  ;-)

The layout generator is modestly challenging.

len


From: Thomas B. Passin [mailto:tpassin@c...]

Anyway, how are you rendering charts in a browser?

*************************************************************************

<html xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns="http://www.w3.org/TR/REC-html40">

<head>
<style>
v\:* {behavior:url(#default#VML);}
</style>
</head>

<body>
<h2>Name Main Table Entity-Relationship Diagram </h2>
<!-- Shape Prototypes -->
<!-- Strong Relationship -->
<v:shapetype id="SRelationship"
path="m10800,0l0,10800,10800,21600,21600,10800xe" fillcolor="blue" 
     coordsize="21600,21600" strokecolor="black" strokeweight="1pt" />

<!-- Child Relationship -->
<v:shapetype id="CRelationship"
path="m10800,0l0,10800,10800,21600,21600,10800xe" fillcolor="green" 
     coordsize="21600,21600" strokecolor="black" strokeweight="1pt"  />  

<!-- Weak/Child Relationship -->
<v:shapetype id="WCRelationship"
path="m10800,0l0,10800,10800,21600,21600,10800xe" fillcolor="green" 
     coordsize="21600,21600" strokecolor="black" strokeweight="3pt" >
    <v:stroke linestyle="thinthin" />  
</v:shapetype> 

<!-- Primary Group -->
<v:group id="ERD" style="position:absolute; left:40pt;top:115pt;
width:40pt;height:40pt;">
  
  <!-- Primary Entity -->
  <v:group id="nmmainEnt" style='left:1pt;top:0pt; width:50pt;height:50pt;'>
     <v:rect style='width:70pt;height:40pt; top:25pt;'  fillcolor="red">
      <v:textbox>
         <b><center>Name Main Table</b><br /><a
href="#nmmain">(NMMAIN)</a></center>PK: Name_id
      </v:textbox>
      <v:fill type="gradient" />
      <v:fill color2="yellow" type="gradient" /> 
     </v:rect>
     <v:line from="0pt,.085pt" to=".175pt,.085pt" />
  </v:group>

  <!-- Entity -->
  <v:group id="lomainEnt"  style="left:10pt;top:0pt;
width:50pt;height:50pt;">
    <v:rect  style='left:200pt; top:30pt; width:65pt;height:35pt'
fillcolor="yellow"  strokecolor="black" strokeweight="1pt">
      <v:textbox><b><center>Master Location Table</b><a
href="#lomain">(LOMAIN)</a></center></v:textbox>
    </v:rect>
    <v:line from="0.505pt, 0.096pt" to="0.666pt, 0.096pt" />
  </v:group> 

  <v:group id="systab1Ent"  style="left:10pt;top:-80pt;
width:50pt;height:50pt;">
    <v:rect  style='left:200pt; top:30pt; width:65pt;height:35pt'
fillcolor="yellow"  strokecolor="black" strokeweight="1pt">
      <v:textbox><b><center>System Table 1</b><br><a
href="#systab1">SYSTAB1</a></center></v:textbox>
    </v:rect>
    <v:line from="0.505pt, 0.096pt" to="0.666pt, 0.096pt" />
  </v:group> 


<!-- Child Entities -->

  <v:group id="childEnts1" style='left:1pt;top:0pt;
width:50pt;height:50pt;'>
     <v:rect style='width:70pt;height:40pt; top:125pt;'  fillcolor="yellow"
strokeweight="3pt">
      <v:stroke linestyle="thinthin" />
      <v:textbox>
         <b><center>Name MO Table</b><br /><a
href="#nmmodop">(NMMODOP)</a></center>
      </v:textbox>
     </v:rect>
     <v:line from="0pt,.338pt" to=".175pt,.338pt" />
  </v:group>

  <v:group id="childEnts2" style='left:150pt;top:0pt;
width:50pt;height:50pt;'>
     <v:rect style='width:70pt;height:40pt; top:125pt;'  fillcolor="yellow"
strokeweight="3pt">
      <v:stroke linestyle="thinthin" />
      <v:textbox>
         <b><center>Name Physical</b><br /><a
href="#nmphys">(NMPHYS)</a></center>
      </v:textbox>
     </v:rect>
     <v:line from="0pt,.338pt" to=".175pt,.338pt" />
  </v:group>

  <v:group id="childEnts3" style='left:300pt;top:0pt;
width:50pt;height:50pt;'>
     <v:rect style='width:70pt;height:40pt; top:125pt;'  fillcolor="yellow"
strokeweight="3pt">
      <v:stroke linestyle="thinthin" />
      <v:textbox>
         <b><center>Related Names</b><br /><a
href="#nmrelat">(NMRELAT)</a></center>
      </v:textbox>
     </v:rect>
     <v:line from="0pt,.338pt" to=".175pt,.338pt" />
  </v:group>

  <v:group id="childEnts4" style='left:450pt;top:0pt;
width:50pt;height:50pt;'>
     <v:rect style='width:70pt;height:40pt; top:125pt;'  fillcolor="yellow"
strokeweight="3pt">
      <v:stroke linestyle="thinthin" />
      <v:textbox>
         <b><center>Scars, Marks, Tattoos</b><br /><a
href="#nmsmt">(NMSMT)</a></center>
      </v:textbox>
     </v:rect>
     <v:line from="0pt,.338pt" to=".175pt,.338pt" />
  </v:group>


  <!-- Relationship -->
  <v:group id="relationshipLKMAINID" style="left:5pt; top:0pt;  width:60pt;
height:50pt;">
      <v:shape type="#SRelationship" style='left:100pt; top:36pt; width:
30pt; height: 20pt;' ></v:shape>
        <v:textbox style="position:relative; top:50pt;">
        <center>FK: lkmainid</center>
        </v:textbox>
  </v:group>

  <v:group id="SYSTAB1Relationship" style="left:175pt; top:-150pt;
width:60pt; height:50pt">
      <v:shape type="#SRelationship" style='left:10pt; top:80pt; width:
30pt; height: 20pt;'  />
        <v:textbox style="position:relative; top:45pt;">
        <center>FK: Code Keys</center>
        </v:textbox>
  </v:group>

  <v:group id="childRelationships" style="left:5pt; top:0pt; width:60pt;
height:50pt">
      <v:shape type="#WCRelationship" style='left:10pt; top:80pt; width:
30pt; height: 20pt;'  />
        <v:textbox style="position:relative; left:70pt; top:40pt;">
        <center>FK: name_id</center>
        </v:textbox>
        <v:line from="0.063pt, 0.165pt" to="0.063pt, 0.2pt" />
  </v:group>

  <v:group id="selfRelationship" style="left:5pt; top:-150pt; width:60pt;
height:50pt">
      <v:shape type="#WCRelationship" style='left:10pt; top:80pt; width:
30pt; height: 20pt;'  />
        <v:textbox style="position:relative; left:70pt; top:0pt;">
        <center>SK: alias_id</center>
        </v:textbox>
  </v:group>

<!-- Connectors -->
  <v:group id="connectors" style="left:5pt; top:0pt; width:50pt;
height:50pt;">
     <!-- NMMAIN to Relationship -->  
      <v:line from="0.170pt,0.116pt" to="0.305pt,0.116pt" />
      <v:line from="0.2pt,0.105pt" to="0.2pt,0.125pt" />
      <!-- To Code Table Entity -->
      <v:line from="0.170pt,0.089pt" to="0.25pt,0.089pt" />
      <v:line from=".25pt, -.01pt" to=".25pt, .089pt" />
      <v:line from=".25pt, -.01pt" to=".30pt, -.01pt" />
      <v:line from=".387pt, -.01pt" to=".512pt, -.01pt" />
 
     <!-- To Child Relationship -->
      <v:line from="0.390pt,0.1155pt "  to="0.510pt,0.1155pt" />
      <!-- To Child Group -->
      <v:line from="0.0752pt,0.25pt "  to="0.0752pt,0.2855pt" />
      <!-- Across Child Entities -->
      <v:line from="0.0752pt,0.2855pt "  to="0.780pt,0.2855pt" />
      <!-- To Children L to R -->
      <v:line from="0.0752pt,0.2855pt "  to="0.0752pt,0.3158pt" />
      <v:line from="0.3200pt,0.2855pt "  to="0.3200pt,0.3158pt" />
      <v:line from="0.5500pt,0.2855pt "  to="0.5500pt,0.3158pt" />
      <v:line from="0.7800pt,0.2855pt "  to="0.7800pt,0.3158pt" />
      <!-- Self-reference: NMMAIN -->
      <!-- Top Left -->
      <v:line from="-.03pt, -.01pt" to=".028pt, -.01pt" />
      <!-- Top Right -->
      <v:line from=".12pt, -.01pt" to=".19pt, -.01pt" />
      <!-- Bottom Left -->
      <v:line from="-.03pt, .075pt" to="-.007pt, .075pt" />
      <!-- Bottom Right -->
      <v:line from=".17pt, .075pt" to=".19pt, .075pt" />
      <!-- Left -->
      <v:line from="-.03pt, -.01pt" to="-.03pt, .075pt" />
      <!-- Right -->
      <v:line from=".19pt, -.01pt" to=".19pt, .075pt" />
  </v:group>
</v:group>
</body>
</html>

-----------------------------------------------------------------
The xml-dev list is sponsored by XML.org <http://www.xml.org>, an
initiative of OASIS <http://www.oasis-open.org>

The list archives are at http://lists.xml.org/archives/xml-dev/

To subscribe or unsubscribe from this list use the subscription
manager: <http://www.oasis-open.org/mlmanage/index.php>



-----------------------------------------------------------------
The xml-dev list is sponsored by XML.org <http://www.xml.org>, an
initiative of OASIS <http://www.oasis-open.org>

The list archives are at http://lists.xml.org/archives/xml-dev/

To subscribe or unsubscribe from this list use the subscription
manager: <http://www.oasis-open.org/mlmanage/index.php>

PURCHASE STYLUS STUDIO ONLINE TODAY!

Purchasing Stylus Studio from our online shop is Easy, Secure and Value Priced!

Buy Stylus Studio Now

Download The World's Best XML IDE!

Accelerate XML development with our award-winning XML IDE - Download a free trial today!

Don't miss another message! Subscribe to this list today.
Email
First Name
Last Name
Company
Subscribe in XML format
RSS 2.0
Atom 0.3
 

Stylus Studio has published XML-DEV in RSS and ATOM formats, enabling users to easily subcribe to the list from their preferred news reader application.


Stylus Studio Sponsored Links are added links designed to provide related and additional information to the visitors of this website. they were not included by the author in the initial post. To view the content without the Sponsor Links please click here.

Site Map | Privacy Policy | Terms of Use | Trademarks
Free Stylus Studio XML Training:
W3C Member
Stylus Studio® and DataDirect XQuery ™are products from DataDirect Technologies, is a registered trademark of Progress Software Corporation, in the U.S. and other countries. © 2004-2013 All Rights Reserved.