Перечень статей   Цветовые обозначения   Choose language


Автоформа для диаграммы-со-скроллингом из базы данных

Синтаксис и поведение

Поведение диаграммы-со-скроллингом, заполняемой из базы данных

<chart name="A" action="./script.cgi" portion="50" visual="20">
</chart>
совпадает с поведением таблицы, заполняемой из базы данных - разница только в способе отображения информации. В частности, отношение "главная-подчиненная" между диаграммами аналогично таковому для таблиц, 
<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>
и отношение "главнЫЕ-подчиненная" между диаграммами также аналогично отношению для таблиц. 
<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>

Диаграмма не может строиться на основе колонок, содержащих булевские данные или картинки, поэтому элементами интерфейса не могут быть checkbox и pic. Во всем остальном поля, по которым строится диаграмма, могут быть задублированы в элементах интерфейса также, как это делается для таблицы, заполняемой из базы данных.

<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">

Однако вложенный элемент select демонстрируется, только если пользователь нажмет правую кнопку мыши на узле ломаной или сегменте "пирога".

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

Отображение столбцов

Разные диаграммы используют разное количество колонок данных, а колонки данных имеют разное предназначение. Связь предназначения серибута и названия серибута указывается в CSS, перед названием серибута ставится знак "§". 
chart {
  presentation: decart;
  x:            §a1;
  y:            §a2;
}
Свойства диаграммы могут быть равны не только константам (как это в CSS сейчас), но и значениям серибутов (в качестве значения свойства нужно указать имя серибута, предварив его знаком "§"). 
chart {
  point-type:   §a4;
  point-color:  §a5;
}

Виды диаграмм, предназначения, свойства

Если предназначение z определено, то диаграмма является 3D; если предназначение z не определено, то диаграмма является 2D. Если предназначение y не определено, то вместо него используется ряд натуральных чисел (начиная с 1), а диаграмма является 2D.

Если определено хотя бы одно из предназначений f1, f2, f3 (отображается векторное поле), то геометрические фигурки в узлах диаграммы являются стрелками, направления и длины стрелок равны вектору [f1, f2, f3]; свойствa point-type, point-height, point-width (используемые для отображения скалярного поля) игнорируются.

Предназначение f, равное (f12 + f22 + f32)1/2, может использоваться только как селектор; предназначение r, равное (x2 + y2 + z2)1/2, может использоваться только как селектор.

a [r > 5] {
  point-color: red;
}
a [f > 3] {
  point-color: green;
}
Предназначения
вид диаграммыпредназначения
pief1
decart, polarx, y, z, r, f1, f2, f3, f


Свойства диаграммы покрывают большинство свойств и атрибутов элемента line (но высота и ширина геометрической фигурки могут быть информативны, поэтому высота и ширина задается по-отдельности), но диаграмма имеет свои уникальные свойства групп plumb (отвес) и veneer (фанера).

Отвесы - это вертикальные линии, опущенные из каждого узла декартовой диаграммы на ось 'X' (в 2D-случае) или плоскость 'X,Y' (в 3D-случае), или опущенные из каждого узла полярной диаграммы на центр диаграммы (в 2D- и 3D-случаях).

Фанеры - это плоскости между отвесами (в 2D- и 3D-случаях).


Свойства
тегсвойствозначение по умолчаниюсписок возможных значений
<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



Построение нескольких графиков на одной диаграмме

Например, 'японские свечи' являются комбинацией трех 2D декартовых графиков: первый имеет цвет отвеса, отличный от цвета фона; второй не имеет отвеса; а третий имеет цвет отвеса, равный цвету фона. Каждый график задается элементом cbody, chart body (таким образом существует несколько этих элементов внутри диаграммы). Все выше упомянутые предназначения и свойства могут указываться как для chart, так и для 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>

Могут ли несколько графиков перекрывать друг друга, а если не могут, то как они должны быть размещены, определяется свойством several элемента chart:



Тюрин Дмитрий



Перечень статей   Цветовые обозначения   Choose language


Hosted by uCoz