List of articles   Colour designations   Choose language


Autoform for chart-with-scrolling from database

Syntax and behaviour

Behaviour of chart-with-scrolling, filled from database

<chart name="A" action="./script.cgi" portion="50" visual="20">
</chart>
coincides with behaviour of table, filled from database - difference is only in way of presentation of information. In particular, relation "master-subordinate" between charts is similar to this for tables,
<chart name="M" action="./scriptM.cgi" portion="50" visual="20" id="id1">
</chart>
<chart name="S" action="./scriptS.cgi" portion="40" visual="10" master="id1">
</chart>
and relation "masterS-subordinate" between charts is also similar to relation for tables.
<chart name="M" action="./scriptM.cgi" portion="50" visual="20" id="id1">
</chart>
<chart name="N" action="./scriptN.cgi" portion="50" visual="20" id="id2">
</chart>
<chart name="P" action="./scriptP.cgi" portion="50" visual="20" id="id3">
</chart>

<chart name="S" action="./scriptS.cgi" portion="40" visual="10" master="id1 id2 id3">
</chart>

Chart can not be build on base of columns, containing boolean data or pictures, thus checkbox and pic can not be so controls. In all other, fields, on which chart is built, can be duplicated in controls similarly, as it is make for table, filled from database.

<chart name="A" action="site.com/dir/script.cgi" portion="50" visual="20">
</chart>
<input    name="A" value="a1" type="text">
<input    name="A" value="a2" type="checkbox">
<input    name="A" value="a3" type="pic">

But enclosed element select is desplayed, only if user press right mouse key on node of broken line or on segment of "pie".

<chart    name="A" action="./script.cgi"  portion="50" visual="20">
  <select name="B" action="./script2.cgi" portion="40" visual="10">a2</select>
</chart>

Displaying of columns

Different charts use different quantity of columns of data, and columns of data have different destination. Relation between destination of seribute and name of seribute is specified in CSS, sign "" is put before seribute name.
chart {
  presentation: decart;
  x:            a1;
  y:            a2;
}
Properties of chart can be equal to not only constant (as in CSS now), but also to values of seribute (it's necessary to specify name of seribute, anticipated by sign "", as value of property).
chart {
  point-type:   a4;
  point-color:  a5;
}

Kinds of chart, distinations, properties

If distination z is specified, then chart is 3D; if distination z is not specified, then chart is 2D. If distination y is not specified, then sequence of natural numbers (beginning from 1) is use instead it, and chart is 2D.

If at least one of distinations f1, f2, f3 is specified (vector field is displayed), than geometrical figures in nodes of chart are arrows, direction and length of arrows are equal to vector [f1, f2, f3]; properties point-type, point-height, point-width (which are used to display scalar field) are ignored.

Distination f, equal (f12 + f22 + f32)1/2, can be used only as selector; distination r, equal (x2 + y2 + z2)1/2, can be used only as selector.

a [r > 5] {
  point-color: red;
}
a [f > 3] {
  point-color: green;
}
Distinations
kind of chartdistinations
pief1
decart, polarx, y, z, r, f1, f2, f3, f


Properties of charts covers of majority of properties and attributes of element line (but height and width of geometrical figure can be informatical, therefore height and width are specified separately), but chart has own unique properties of group plumb and veneer.

Plumbs are vertical lines from each node of decart chart to axix 'X' (in 2D-case) or plane 'X,Y' (in 3D-case), or from each node of polar chart to center of chart (in 2D- and 3D-cases).

Veneers are planes between plumbs (in 2D- and 3D-cases).


Properties
tagpropertydefault valuelist of possible values
<chart action= > point-typenullnull (none), disc, circle, square, decimal, star, romb, triangle, hex
point-color,
section-color, plumb-color,
veneer-color
blackaqva, black, blue, fuchsia, gold, gray, green, indigo, lime, maroon, navy, olive, orange, purple, red, silver, teal, violet, white, yellow, #FFFFFF
section-type, plumb-type none none, dotted, dashed, solid, double, groove, ridge, triple
point-height, point-width,
section-width, plumb-width
thinthin, medium, thick, float
point-note,
section-note, plumb-note,
veneer-note
 any text
section-begin, section-end any text
point-title,
section-title, plumb-title,
veneer-title
 any text
alignintohorside, verside, into
splinenoyes, no
gridnoyes, no
grid4cursornoyes, no
x-logarithmic, y-logarithmic, z-logarithmic any natural number, more 1
x-label, y-label, z-label any text



Creating of several graph on one chart

For example, 'japanese candles' is combination of three 2D decart graph: first has color of plumb, different from background; second has no plumb; and third has color of plumb, equal to color of background. Each graph is assigned by element cbody, chart body (thus there are several such elements inside chart). All distinations and properties, mentioned above, can be specified both for chart, and for cbody.

<chart several="stacked">
  <cbody name="A" action="./script.cgi" portion="50" visual="20">
  <cbody name="B" action="./script.cgi" portion="50" visual="20">
  <cbody name="C" action="./script.cgi" portion="50" visual="20">
</chart>

Whether several graph can cross each other, and if they can, then how they should be placed, is specified by property several of element chart:



Dmitry Turin



List of articles   Colour designations   Choose language


Hosted by uCoz