График с помощью TChart
Можно сказать, что данная статья является продолжением статьи про закрашивание ячеек в TStringGrid. Конечно мы в данной статье будем говорить не совсем о закрашивании ячеек, но связь с этим есть. В данной статье, я хотел бы поговорить, как можно построить разноцветный график с помощью стандартного компонента TChart. В свое время, я делал курсовой проект, который предназначен для анализа ассортимента методом XYZ. Другими словами, товар поставщиков необходимо было рассортировать по группам X, Y или Z. В зависимости от качества и расчета определенных параметров необходимо было сделать рассортировку по этим группам. Все данные и расчеты я отображал в TStringGrid. Для того, чтобы пользователю было понятно какие данные попадают в какие группы, я сделал пометку, что красный цвет — группа X, например, желтый — группа Y, зеленый — группа Z. После этого, как и в прошлой статье, я закрашивал ячейки в определенный цвет, которые удовлетворяют условию группам. Все данные я отсортировал в порядке возрастания и получилось так, после того, как я раскрасил группы, что вначале идет группа X, потом Y, затем Z, а не в разнобой все группы были в TStringGrid. На основе этого мне было легко построить график, который отображал все значения этих групп нужным цветом.
Ниже я привожу скриншот, как выглядели мои данные в TStringGrid.
Для того, чтобы получить что-то похожее, нам вначале необходимо будет отсортировать наши данные. На форме у меня следующие компоненты
TStringGrid я настроил следующим образом, в свойствах я указал:
Теперь немного настроим TChart, необходимо для начала нам выбрать тип графика. Нажимаем двойным щелчком мыши по компоненту TChart и переходим во вкладку Series и в данной вкладке нажимаем на кнопку Add. После чего появится список всех доступных графиков, в нашем случае я выбрал самый первый тип графика (линейный) — Line. Если хотите сделать какие-то другие настройки, то пожалуйста, на остальных вкладках это можно сделать.
После того, как мы настроили наши 2 компонента, нам теперь необходимо придумать условие, по которому будут закрашиваться наши ячейки и строиться график. Как я уже говорил в программе XYZ, я делал определенные расчеты и относил их в нужные группы, перед этим сперва сортировал их. Пусть, значения от 1 до 10 закрашиваются в красный, от 11 до 20 в желтый цвет, а от 21 до бесконечности в зеленый цвет. Теперь, как и в прошлой статье, мы напишем условие, по которому будем закрашивать ячейки. На событие OnDrawCell напишем следующий код:
procedure TForm1.StringGrid1DrawCell(Sender: TObject; ACol, ARow: Integer; Rect: TRect; State: TGridDrawState); begin if StringGrid1.Cells[ACol,ARow]<>'' then begin if (StrToInt(StringGrid1.Cells[ACol,ARow])>=1) and (StrToInt(StringGrid1.Cells[ACol,ARow])=10) then begin StringGrid1.Canvas.Brush.Color:=clRed; StringGrid1.Canvas.FillRect(Rect); StringGrid1.Canvas.TextOut(Rect.Left,Rect.Top,StringGrid1.Cells[ACol,ARow]); end; if (StrToInt(StringGrid1.Cells[ACol,ARow])>=11) and (StrToInt(StringGrid1.Cells[ACol,ARow])=21) then begin StringGrid1.Canvas.Brush.Color:=clYellow; StringGrid1.Canvas.FillRect(Rect); StringGrid1.Canvas.TextOut(Rect.Left,Rect.Top,StringGrid1.Cells[ACol,ARow]); end; if (StrToInt(StringGrid1.Cells[ACol,ARow])>21) then begin StringGrid1.Canvas.Brush.Color:=clGreen; StringGrid1.Canvas.FillRect(Rect); StringGrid1.Canvas.TextOut(Rect.Left,Rect.Top,StringGrid1.Cells[ACol,ARow]); end; end; end;
Мы уже разбирали данный код, как происходит закрашивание, поэтому тут останавливаться не будем. После того как у нас сформировано условие, по которому мы закрашиваем ячейки в определенный цвет, теперь как я и говорил, нам необходимо все эти данные отсортировать. Возьмем самый простой способ сортировки — минимальным элементом. Вот так мы отсортируем данные в TStringGrid по возрастанию:
for i:=0 to StringGrid1.ColCount-1 do begin min:=StrToInt(StringGrid1.Cells[i,0]); for j:=i+1 to StringGrid1.ColCount-1 do begin if StrToInt(StringGrid1.Cells[j,0])then begin b:=StrToInt(StringGrid1.Cells[j,0]); StringGrid1.Cells[j,0]:=IntToStr(min); StringGrid1.Cells[i,0]:=IntToStr(b); min:=b; end; end; end;
Все переменные, что используются в данном коде имеют тип integer
Данные у нас готовы, отсортированы, теперь нам необходимо просто-напросто построить по тем же данным график и на определенных промежутках закрасить график, удовлетворяющий определенному условию, в нужный нам цвет. Для этого мы организуем цикл, и в данном цикле мы также будем проверять наше условие, и устанавливать цвет графику, в итоге у меня получилось что-то похожее, весь код с сортировкой:
procedure TForm1.Button1Click(Sender: TObject); var i,j,min,b,x,y:integer; begin try for i:=0 to StringGrid1.ColCount-1 do begin min:=StrToInt(StringGrid1.Cells[i,0]); for j:=i+1 to StringGrid1.ColCount-1 do begin if StrToInt(StringGrid1.Cells[j,0])then begin b:=StrToInt(StringGrid1.Cells[j,0]); StringGrid1.Cells[j,0]:=IntToStr(min); StringGrid1.Cells[i,0]:=IntToStr(b); min:=b; end; end; end; for i:=0 to StringGrid1.ColCount-1 do begin x:=i; y:=StrToInt(StringGrid1.Cells[i,0]); if (StrToInt(StringGrid1.Cells[i,0])>=1) and (StrToInt(StringGrid1.Cells[i,0])=10) then Chart1.Series[0].AddXY(x,y,'',clRed); if (StrToInt(StringGrid1.Cells[i,0])>=11) and (StrToInt(StringGrid1.Cells[i,0])=21) then Chart1.Series[0].AddXY(x,y,'',clYellow); if (StrToInt(StringGrid1.Cells[i,0])>21) then Chart1.Series[0].AddXY(x,y,'',clGreen); end; except on e:Exception do ShowMessage(e.Message); end; end;
Тут можно было обойтись и без таких условий, а организовать нужные нам циклы. Вот весь код, который сперва сортирует данные, а затем по ним строит график.
Ну и в концовке, сделаем небольше настройки для TChart, для этого мы и устанавливали на форму TCheckBox. Один TCheckBox будет отвечать за 3D-график, а второй за наличие нашей легенды. Вот код, который отвечает за 3D-график:
procedure TForm1.CheckBox1Click(Sender: TObject); begin Chart1.View3D:=CheckBox1.Checked; end;
А вот код, который отвечает за наличие легенды
procedure TForm1.CheckBox2Click(Sender: TObject); begin Chart1.Legend.Visible:=CheckBox2.Checked; end;
Ну и в концовке скриншот, который у меня получился в курсовом проекте, при построении графика, что-то похожее и у нас получилось
| Хочу заметить, что каждый из нас не сможет обходится без компьютера и каждый его использует в своих целях. Конечно хочется более улучшенной конфигурации компьютер. Так что, если Вы надумали себе купить компьютер, то приобретайте его более новой конфигурации, во-первых он Вам дольше прослужит, а во-вторых он дешевле Вам обойдется, что очень важно этот фактор в настоящее время. |
Исходник статьи можно скачать тут
построение графика tchart
P.S.: из Вашего кода я так и не понял, что должно быть. Сначала цикл до какого-то n, который никак не изменяется. Затем вложенный цикл по столбцам таблицы, хотя нужны строки, с добавлением каких-то координат, которые в свою очередь неизвестны. Дальше в ячейки таблицы присваиваются опять эти неизвестные координаты. Вы понимаете?
__________________
Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете.
Последний раз редактировалось Kailon, 22.06.2016 в 15:01 .
Tchart delphi как построить график
На этом шаге мы рассмотрим компонент TChart .
Компонент TChart является контейнером объектов Series типа TChartSeries — серий данных, характеризующихся различными стилями отображения. Каждый компонент может включать несколько серий. При отображении графика каждая серия соответствует одной кривой на графике. При отображении диаграммы для некоторых видов диаграмм можно наложить друг на друга несколько различных серий. В этом случае можно задать для одного компонента TChart несколько серий одинаковых данных с разными типами диаграммы. Делая в каждый момент времени активной одну из них, можно предоставить пользователю выбор типа диаграммы, отображающей интересующие его данные.
Создание графика
Для того чтобы создать график необходимо разместить компонент TChart на форме или воспользоваться мастером. Если использовать непосредственное размещение на форме, то будет создана диаграмма без использования базы данных. При создании диаграммы с помощью мастера можно применить режим Data Base Chart (Использовать базу данных) . Мастер запускается командой File | New |Other , после чего в появившемся окне необходимо выбрать вкладку Business , на ней — пиктограмму TeeChartWizard (Мастер диаграмм) , затем разработчик может сделать предварительные настройки. Сначала выбирается один из переключателей: Data Base Chart (Использовать базу данных) или Non Data Base Chart (Не использовать базу данных) . Затем выбирается внешний вид диаграммы: она может быть двухмерной или трехмерной, что определяется переключателем 2D/3D . Далее по желанию устанавливаются или сбрасываются флажки. Флажок Show Legend (отображать условные обозначения) определяет наличие дополнительной панели, на которой указывается соответствие цветов фрагментов диаграммы указанным значениям. Флажок Show Marks (Отображать метки) включает небольшие желтые подсказки каждого фрагмента диаграммы. На этом создание диаграммы с помощью мастера заканчивается. После щелчка на кнопке Finish в дизайнере форм появится новая форма, на которой будет расположен объект Chart . Если был выбран режим Non Data Base Chart , то он будет заполнен набором случайно сгенерированных значений, которые в дальнейшем заменятся на необходимые данные. Таким образом в форме будет создана заготовка (рис.1).
Рис.1.Заготовка графика в форме
После двойного щелчка мыши по этой заготовке, будет произведен переход в редактор графика . В среде этого редактора можно установить свойства графика и его серий. Содержимое редактора графика представляет собой табулированный блокнот. Для нового графика первой всегда показывается закладка Chart и для страницы Chart — закладка Series (рис.2).
Рис.2. Редактор графика
Каждая из закладок на странице Chart предназначена для установки параметров того или иного компонента графика:
Series — содержит серии графика . Серией называется набор точек графика . На графике серии соответствует отдельная линия или ряд столбцов. Если в графике несколько серий, то будет визуализировано несколько линий или рядов столбцов.
General — устанавливает общие параметры графика , такие как объемность графика, отступы от краев, возможность увеличения ( Zoom ) и др.
Axis — устанавливает свойства осей (рис.3.).
Рис.3. Редактор графика — окно установки свойств осей
В области ShowAxis определяется, для какой оси устанавливаются параметры — левой, правой, верхней или нижней. На странице, определяемой закладкой Scales , устанавливаются свойства масштаба значений по оси. Automatic устанавливает автоматическое масштабирование данных по оси — минимум и максимум вычисляются динамически, исходя из текущих значений серии. При отмене автоматического масштабирования можно установить автоматическое масштабирование минимального ( Minimum ) или максимального ( Maximum ) значения (отметка Auto ). Для установки значения максимума и (или) минимума вручную следует нажать соответствующую кнопку Change . Шаг масштаба по оси выбирается автоматически, если в Desired Increment установлено значение 0 . Установить фиксированное значение шага можно, нажав кнопку Change . Закладка Title позволяет установить текст заголовка по оси, угол расположения заготовки и шрифт, которым заголовок выводится. Закладка Labels задает параметры меток для оси. Закладка Tiks устанавливает параметры самой линии оси.
Titles — определяет заголовок графика, шрифт, выравнивание и др.
Legend — задает параметры легенды. Легенда — это область графика, где приводится информация о графике . Легенда служит для пояснения графика.
Panel — определяет параметры панели, на которой располагается график.
Paging — устанавливает параметры многостраничного графика.
Walls — задает «стенку» графика.
3D — дает возможность изменить внешний вид диаграммы: наклон, сдвиг, толщину и т.д.
Добавление серии в график
На графике одновременно может располагаться несколько серий. В большинстве случаев их значения строятся по одинаковому закону и две и более серий одновременно показываются в графике для сравнения.
Чтобы добавить в график серию, следует на странице Chart , (закладка Series ) нажать кнопку Add . После этого появится окно выбора типа серии (рис.4.).
Рис.4.Редактор графика — окно выбора типа серии
После выбора типа серии в график добавляется компонент, дочерний от базового типа TChartSeries — TLineSeries, TBarSeries, TPieSeries и т.д. Для примера выберем серию типа Line и нажмем Ok . В окне страницы Chart (закладка Series ) будет показана серия (рис.5.).
Рис.5.Редактор графика — список серии графика
Кнопка Add может использоваться для добавления других серий, кнопка Delete — для удаления текущей серии. После нажатия кнопки Title можно определить заголовок серии, кнопки Clone -создать новый экземпляр такой же серии в этом же графике, кнопки Change — изменить тип текущей серии.
Перейдем с закладки Chart на закладку Series . На этой странице представлен блокнот с закладками Format, General, Marks, Data Source . Рассмотрим свойства серии, которые можно установить на страницах, соответствующих этим закладкам.
Главные свойства серии можно определить на странице Data Source . На ней определяется источник данных для серии. Выпадающий список ниже закладки позволяет определить тип источника данных для серии:
No Data — серии не назначается источник данных. Заготовленный шаблон серии может в разное время использоваться для показа данных из разных источников.
Random Values — набор случайных чисел, может быть полезен при формировании заготовки серии.
Function — функция ( Copy, Average, Low, High, Divide, Multiply, Subtract, Add ) — служит для построения графиков на основании данных в двух или более сериях.
Свойства компонента TChart :
- pmNone — прокрутка запрещена;
- pmHorizontal — прокрутка разрешена в горизонтальном направлении;
- pmVertical — прокрутка разрешена в вертикальном направлении;
- pmBoth — прокрутка разрешена в обоих направлениях.
Для задания отображаемых значений используются методы серии Series . Основные:
Метод Clear очищает серию от занесенных ранее данных.
Add(const AValue: Double; const ALabel: String; AColor: TColor)
позволяет добавить в диаграмму новую точку. Параметр AValue соответствует добавляемому значению, параметр ALabel — название, которое будет отображаться на диаграмме и в легенде, AColor — цвет. Заметим, что параметр ALabel — не обязательный, его можно задать пустым: ‘ ‘.
AddXY(const AXValue, AYValue: Double; const ALabel: String; AColor: TColor)
позволяет добавить в график функции новую точку. Параметр AXValue и AYValue соответствуют аргументу и функции. Параметр ALabel и AColor те же, что и в методе Add .
Так же компонент TChart имеет метод Print , обеспечивающий печать. Предварительно может быть выполнен метод PrintPortrait , задающий книжную (вертикальную) ориентацию бумаги, или метод PrintLandscape , задающий альбомную (горизонтальную) ориентацию. Масштабировать размер печатаемого графика можно, вызвав предварительно метод PrintRect :
procedure PrintRect(const R: TRect);
в котором параметр R определяет размер области принтера, в которой осуществляется печать.
Приведем пример: обработчик события OnActivate формы создает график, показанный на рис.6.:
procedure TForm1.FormActivate(Sender: TObject); var k: integer; begin for k:=0 to 20 do Chart1.SeriesList[0].AddXY(k, cos(k*pi/5),' ', clRed); end;
Текст этого примера можно взять здесь.
Рис.6.Пример использования компонента TChart
Таким образом компонент TChart предназначен для графического представления числовых данных. Компонент содержит большое количество специфичных свойств, событий и методов. Впервые компонент появился в версии 3.
На следующем шаге мы рассмотрим компонент TActionManager .
Создание графиков. TChart
Задача: сделать программу, которая строит заданный график.
Пример: построить y =10* sin ( x ), аналог Excel диаграммы.
- In Design — time (в процессе разработки)
- In Run — Time (в процессе выполнения кода)
Выбираем тип графика Line
procedure TForm1.BitBtn1Click(Sender: TObject); var i:integer; begin Series1.Clear; for i:=0 to 22 do begin Series1.AddXY(i*0.29,10*sin(i*0.29),»,clGreen); end; end;
Порядок вывода комментариев: