<?xml version='1.0' encoding="utf-8"?>
      <rss version='2.0'>
      <channel>
      <title>Форум на Исходниках.RU</title>
      <link>https://forum.sources.ru</link>
      <description>Форум на Исходниках.RU</description>
      <generator>Форум на Исходниках.RU</generator>
  	
      <item>
        <guid isPermaLink='true'>https://forum.sources.ru/index.php?showtopic=214813&amp;view=findpost&amp;p=1798561</guid>
        <pubDate>Tue, 11 Dec 2007 05:49:38 +0000</pubDate>
        <title>Chart</title>
        <link>https://forum.sources.ru/index.php?showtopic=214813&amp;view=findpost&amp;p=1798561</link>
        <description><![CDATA[ob-lom: Создание графика<br>
<br>
    После двойного щелчка мыши по этой заготовке, будет произведен переход в редактор графика. В среде этого редактора можно установить свойства графика и его серий. Содержимое редактора графика представляет собой табулированный блокнот. Для нового графика первой всегда показывается закладка Chart и для страницы Chart - закладка Series (рис.1). <br>
<br>
<img class='tag-img' src='http://img.pixs.ru/images/image001jp_5112217_21524.jpg' alt='user posted image'><br>
Рис.1. Редактор графика<br>
<br>
    Каждая из закладок на странице Chart предназначена для установки параметров того или иного компонента графика: <br>
<br>
    Series - содержит серии графика. Серией называется набор точек графика. На графике серии соответствует отдельная линия или ряд столбцов. Если в графике несколько серий, то будет визуализировано несколько линий или рядов столбцов. <br>
<br>
    General - устанавливает общие параметры графика, такие как объемность графика, отступы от краев, возможность увеличения (Zoom) и др. <br>
<br>
    Axis - устанавливает свойства осей (рис.2.). <br>
<br>
<a class='tag-url' href='http://pixs.ru/?ref=21525' target='_blank'><img class='tag-img' src='http://img.pixs.ru/images/image002jp_1336580_21525.jpg' alt='user posted image'></a><br>
Рис.2. Редактор графика - окно установки свойств осей <br>
<br>
    В области ShowAxis определяется, для какой оси устанавливаются параметры - левой, правой, верхней или нижней. На странице, определяемой закладкой Scales, устанавливаются свойства масштаба значений по оси. Automatic устанавливает автоматическое масштабирование данных по оси - минимум и максимум вычисляются динамически, исходя из текущих значений серии. При отмене автоматического масштабирования можно установить автоматическое масштабирование минимального (Minimum) или максимального (Maximum) значения (отметка Auto). Для установки значения максимума и (или) минимума вручную следует нажать соответствующую кнопку Change. Шаг масштаба по оси выбирается автоматически, если в Desired Increment установлено значение 0. Установить фиксированное значение шага можно, нажав кнопку Change. Закладка Title позволяет установить текст заголовка по оси, угол расположения заготовки и шрифт, которым заголовок выводится. Закладка Labels задает параметры меток для оси. Закладка Tiks устанавливает параметры самой линии оси. <br>
<br>
    Titles - определяет заголовок графика, шрифт, выравнивание и др. <br>
<br>
    Legend - задает параметры легенды. Легенда - это область графика, где приводится информация о графике. Легенда служит для пояснения графика. <br>
<br>
    Panel - определяет параметры панели, на которой располагается график. <br>
<br>
    Paging - устанавливает параметры многостраничного графика. <br>
<br>
    Walls - задает &quot;стенку&quot; графика. <br>
<br>
    3D - дает возможность изменить внешний вид диаграммы: наклон, сдвиг, толщину и т.д. <br>
<br>
Добавление серии в график<br>
    На графике одновременно может располагаться несколько серий. В большинстве случаев их значения строятся по одинаковому закону и две и более серий одновременно показываются в графике для сравнения. <br>
<br>
    Чтобы добавить в график серию, следует на странице Chart, (закладка Series) нажать кнопку Add. После этого появится окно выбора типа серии (рис.3.). <br>
<br>
<a class='tag-url' href='http://pixs.ru/?ref=21526' target='_blank'><img class='tag-img' src='http://img.pixs.ru/images/image003jp_7784376_21526.jpg' alt='user posted image'></a><br>
Рис.3.Редактор графика - окно выбора типа серии <br>
<br>
    После выбора типа серии в график добавляется компонент, дочерний от базового типа TChartSeries - TLineSeries, TBarSeries, TPieSeries и т.д. Для примера выберем серию типа Line и нажмем Ok. В окне страницы Chart (закладка Series ) будет показана серия (рис.4.). <br>
<br>
<a class='tag-url' href='http://pixs.ru/?ref=21527' target='_blank'><img class='tag-img' src='http://img.pixs.ru/images/image004jp_5451402_21527.jpg' alt='user posted image'></a><br>
<br>
Рис.4.Редактор графика - список серии графика <br>
<br>
    Кнопка Add может использоваться для добавления других серий, кнопка Delete - для удаления текущей серии. После нажатия кнопки Title можно определить заголовок серии, кнопки Clone -создать новый экземпляр такой же серии в этом же графике, кнопки Change - изменить тип текущей серии. <br>
<br>
    Перейдем с закладки Chart на закладку Series. На этой странице представлен блокнот с закладками Format, General, Marks, Data Source. Рассмотрим свойства серии, которые можно установить на страницах, соответствующих этим закладкам. <br>
<br>
    Главные свойства серии можно определить на странице Data Source. На ней определяется источник данных для серии. Выпадающий список ниже закладки позволяет определить тип источника данных для серии: <br>
<br>
    <strong class='tag-b'>No Data</strong> - серии не назначается источник данных. Заготовленный шаблон серии может в разное время использоваться для показа данных из разных источников. <br>
<br>
    <strong class='tag-b'>Random Values</strong> - набор случайных чисел, может быть полезен при формировании заготовки серии. <br>
<br>
    <strong class='tag-b'>Function</strong> - функция (Copy, Average, Low, High, Divide, Multiply, Subtract, Add) - служит для построения графиков на основании данных в двух или более сериях. <br>
<br>
    Свойства компонента TChart: <br>
<br>
Свойства компонента TChart Свойство<br>
 <br>
<strong class='tag-b'>Property AllowPanning : TPanningMode;</strong> - Определяет возможность пользователя прокручивать наблюдаемую часть графика во время выполнения, нажимая правую кнопку мыши. Возможны значения: <br>
<br>
<strong class='tag-b'>pmNone</strong> - прокрутка запрещена; <br>
<strong class='tag-b'>pmHorizontal</strong> - прокрутка разрешена в горизонтальном направлении; <br>
<strong class='tag-b'>pmVertical</strong> - прокрутка разрешена в вертикальном направлении; <br>
<strong class='tag-b'>pmBoth</strong> - прокрутка разрешена в обоих направлениях. <br>
 <br>
<strong class='tag-b'>Property AllowZoom : Boolean;</strong> - Позволяет пользователю изменять во время выполнения масштаб изображения, вырезая фрагменты диаграммы или графика курсором мыши.<br>
 <br>
<strong class='tag-b'>Property BackWall : TChartWall; <br>
PropertyBottomWall : TChartWall; <br>
Property LeftWall : TChartWall;</strong> -  Определяют характеристики соответственно задней, нижней и левой граней области трехмерного отображения графика.<br>
 <br>
<strong class='tag-b'>PropertyBottomAxis : TChartAxis;<br>
Property LeftAxis : TChartAxis; <br>
Property RightAxis : TChartAxis;</strong> - Определяют характеристики соответственно нижней, левой и правой осей.<br>
 <br>
<strong class='tag-b'>Property Chart3dPercent : Integer;</strong> -  Масштаб трехмерного отображения диаграммы.<br>
 <br>
<strong class='tag-b'>Property Foot : TChartTitle;</strong> - Определяет подпись под диаграммой. По умолчанию отсутствует. Текст подписи определяется под свойством Text.<br>
 <br>
<strong class='tag-b'>Property Frame : TChartPen;</strong> - Определяет рамку вокруг диаграммы.<br>
 <br>
<strong class='tag-b'>Property Legend : TChartLegend;</strong> - Легенда диаграммы - список обозначений.<br>
 <br>
<strong class='tag-b'>Property MarginLeft : Integer;<br>
Property MarginRight : Integer;<br>
Property MarginTop : Integer;<br>
Property MarginBottom : Integer;</strong> - Значения левого, правого, верхнего и нижнего полей.<br>
 <br>
<strong class='tag-b'>Property SeriesList : TChartSeriesList;</strong> - Список серий данных, отображаемых в компоненте.<br>
 <br>
<strong class='tag-b'>Property Title : TChartTitle;</strong> - Определяет заголовок диаграммы.<br>
 <br>
<strong class='tag-b'>Property View3d : Boolean;</strong> - Разрешает или запрещает трехмерное отображение диаграммы.<br>
 <br>
<br>
    Для задания отображаемых значений используются методы серии Series. Основные: <br>
<br>
    Метод Clear очищает серию от занесенных ранее данных. <br>
<br>
    Метод <strong class='tag-b'>Add</strong>: <br>
<br>
 Add(const AValue: Double; const ALabel: String; AColor: TColor) <br>
позволяет добавить в диаграмму новую точку. Параметр AValue соответствует добавляемому значению, параметр ALabel - название, которое будет отображаться на диаграмме и в легенде, AColor - цвет. Заметим, что параметр ALabel - не обязательный, его можно задать пустым: &#39; &#39;. <br>
<br>
    Метод <strong class='tag-b'>AddXY</strong>: <br>
<br>
AddXY(const AXValue, AYValue: Double; const ALabel: String; AColor: TColor) <br>
позволяет добавить в график функции новую точку. Параметр AXValue и AYValue соответствуют аргументу и функции. Параметр ALabel и AColor те же, что и в методе Add. <br>
<br>
    Так же компонент TChart имеет метод Print, обеспечивающий печать. Предварительно может быть выполнен метод PrintPortrait, задающий книжную (вертикальную) ориентацию бумаги, или метод PrintLandscape, задающий альбомную (горизонтальную) ориентацию. Масштабировать размер печатаемого графика можно, вызвав предварительно метод PrintRect: <br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">procedure PrintRect(const R: TRect);</div></ol></div></div></div></div><script>preloadCodeButtons('1');</script><br>
 в котором параметр R определяет размер области принтера, в которой осуществляется печать. <br>
<br>
    Приведем пример: обработчик события OnActivate формы создает график, показанный на рис.6.: <br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">procedure TForm1.FormActivate(Sender: TObject);</div><div class="code_line">&nbsp;var k: integer;</div><div class="code_line">&nbsp;&nbsp;begin</div><div class="code_line">&nbsp;&nbsp; for k:=0 to 20 do</div><div class="code_line">&nbsp;&nbsp; &nbsp;Chart1.SeriesList[0].AddXY(k, cos(k*pi/5),&#39; &#39;, clRed);</div><div class="code_line">&nbsp;&nbsp;end;</div></ol></div></div></div></div><br>
Текст этого примера можно взять здесь. <br>
<br>
<a class='tag-url' href='http://pixs.ru/?ref=21528' target='_blank'><img class='tag-img' src='http://img.pixs.ru/images/image005jp_2494249_21528.jpg' alt='user posted image'></a><br>
<br>
Рис.5.Пример использования компонента TChart <br>
<br>
    Таким образом компонент TChart предназначен для графического представления числовых данных. Компонент содержит большое количество специфичных свойств, событий и методов. <br>
<br>
У компонента chart много важных свойств, которые нужны для построения графиков. Я попытаюсь описать самые основные свойства.<br>
<br>
Установка точек <br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">&nbsp;&nbsp; &nbsp; For i:=1 to 10 do </div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp;Begin</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; X:=значение(i);</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;with series1 do &nbsp;// точки с координатами по осям X график 1</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; begin</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; add(X,&#39;string&#39;,clblack);</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; end;</div><div class="code_line">&nbsp;&nbsp; &nbsp; </div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;with series2 do &nbsp;// точки с координатами по осям X и Y график 2</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; begin</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;Y:=наше значение;</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if Y&#60;&#62;&#39;&#39; then</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if Y&#60;&#62;&#39;0&#39; then</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;addxy(i,Y,&#39;string&#39;,clred);</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; end;</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp;end;</div></ol></div></div></div></div>      <br>
<br>
Установка более конкретных координат на графике реализуется свойством addxy(X,Y,&#39;string&#39;,clred)<br>
<br>
Время по оси X с файла. Самое главное чтобы series был первым, если этого не сделать, то значения не отобразиться. Количество значений может быть любым, лишние скроются, а при увеличении будут отображаться.<br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">&nbsp;AssignFile(file,&#39;С:/параметры.txt&#39;);</div><div class="code_line">&nbsp;&nbsp; reset(file);</div><div class="code_line">&nbsp;&nbsp; &nbsp;for i:=0 to 2000 do</div><div class="code_line">&nbsp;&nbsp; &nbsp; begin</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp;readln(file,string);</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp;if string&#60;&#62;&#39;&#39; then</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; begin</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;i:=i+1;</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;with series1 do</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; addxy(i,0,string,clblack);</div><div class="code_line">&nbsp;&nbsp; &nbsp; &nbsp; end;</div><div class="code_line">&nbsp;&nbsp; &nbsp; end;</div><div class="code_line">&nbsp;&nbsp;CloseFile(file);</div></ol></div></div></div></div><br>
 <br>
Печать графика. Подгонял параметры Rect под стандартный лист формата А4.<br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">procedure TForm1.ButtonClick(Sender: TObject);</div><div class="code_line">var Rect:TRect;</div><div class="code_line">begin</div><div class="code_line">&nbsp;if PrintDialog.Execute then //пользователь выбрал печать</div><div class="code_line">&nbsp;&nbsp;begin</div><div class="code_line">&nbsp;&nbsp; Rect.Left:=0;</div><div class="code_line">&nbsp;&nbsp; Rect.Top:=0;</div><div class="code_line">&nbsp;&nbsp; Rect.Right:=6800;</div><div class="code_line">&nbsp;&nbsp; Rect.Bottom:=4850;</div><div class="code_line">&nbsp;&nbsp; Chart1.PrintRect(rect);</div><div class="code_line">&nbsp;&nbsp;end;</div><div class="code_line">end;</div></ol></div></div></div></div><br>
 <br>
<br>
Бывает что 2 графика разные по длине, у одного 1500 значений, а у другого 1300. Но надо чтобы они были визуально равны. Для этого используется банальная  математика. Х:=1500/1300; <br>
<br>
X=1.1538461538461538461538461538462 то что значение такое длинное не имеет значение сам компонент будет рисовать и по таким значениям. Использовать только со свойством addxy(X,Y,&#39;string&#39;,clred)<br>
<br>
Заголовок диаграммы<br>
<br>
Рассмотрим основные свойства объекта ChartTitle. Заголовок и текст заголовка выводится при условии, что в поле HasTitle объекта Chart записано значение True, а поле Text объекта ChartTitle записан сам текст. Смотрите пример:<br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">E.Charts.Item[name].HasTitle:=True;</div><div class="code_line">E.Charts.Item[name].ChartTitle.Text:=&#39;Заголовок диаграммы&#39;;</div></ol></div></div></div></div><br>
<br>
 Координаты заголовка содержатся в полях Left и Top объекта ChartTitle. Для перемещения заголовка запишите в эти поля новые значения координат. Для определения координат считайте значения из этих полей.<br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">E.Charts.Item[name].ChartTitle.Left:=Left;</div><div class="code_line">E.Charts.Item[name].ChartTitle.Top:=Top;</div></ol></div></div></div></div><br>
<br>
 Чтобы изменить визуальные параметры рамки, используйте объект Border и его поля Color (цвет), Weight (толщина) и LineStyle (стиль линии)<br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">E.Charts.Item[name].ChartTitle.Border.Color:=Color;</div><div class="code_line">E.Charts.Item[name].ChartTitle.Border.Weight:=Weight;</div><div class="code_line">E.Charts.Item[name].ChartTitle.Border.LineStyle:=LineStyle;</div></ol></div></div></div></div><br>
<br>
 Для заполнения цветом и узором области заголовка используйте объект Interior и его поля Color (цвет), Pattern (узор) и PatternColor (цвет узора).<br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">E.Charts.Item[name].ChartTitle.Interior.Color:=Color;</div><div class="code_line">E.Charts.Item[name].ChartTitle.Interior.Pattern:=Pattern;</div><div class="code_line">E.Charts.Item[name].ChartTitle.Interior.PatternColor:=PatternColor;</div></ol></div></div></div></div><br>
<br>
Чтобы заполнить область заголовка рисунком из графического файла, используйте метод UserPicture объекта Fill. Чтобы этот рисунок стал видимым, запишите в поле Visible объекта Fill значение True.<br>
<br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">E.Charts.Item[name].ChartTitle.Fill.UserPicture(PictureFile:= File_);</div><div class="code_line">E.Charts.Item[name].ChartTitle.Fill.Visible:=True;</div></ol></div></div></div></div><br>
<br>
Прорисовка только точек (или убирать линии соединяющие точки графика и назад отображать) <br>
<br>
1.Для этого создаем новый график Point, смотрим рисунок 4 (series1) и изменяем, свойство series1.Pointer.Style:=psSmallDot (график с помощью точек рисуется точно также как и с помощью линий). <br>
<br>
2.Потом добавляем график смотрим рисунок 4 (series2) меняем свойство Editing Chart –&gt; Series –&gt; Series2 –&gt; Data Source –&gt; Function и выбираем series1. (если все сделано правильно, то точки и линия будут совпадать на компоненте).<br>
<br>
3.Убираем линию Series2.Active:=true and false <br>
<br>
<span class="tag-color tag-color-named" data-value="gray" style="color: gray"><span class='tag-size' data-value='7' style='font-size:7pt;'>Добавлено <time class="tag-mergetime" datetime="2007-12-11T08:57:42+03:00">11.12.07, 05:57</time></span></span><br>
<div class='tag-code'><span class='pre_code'></span><div class='code  code_collapsed ' title='Подсветка синтаксиса доступна зарегистрированным участникам Форума.' style=''><div><div><ol type="1"><div class="code_line">замечания и предложения будут рассматриваться в первую очередь</div></ol></div></div></div></div>]]></description>
        <author>ob-lom</author>
        <category>Общие вопросы</category>
      </item>
	
      </channel>
      </rss>
	