Difference between revisions of "TAChart User Guide"

From Lazarus wiki
Jump to navigationJump to search
m
 
(225 intermediate revisions by 4 users not shown)
Line 1: Line 1:
! Updating in progress !
 
 
__NOTOC__
 
__NOTOC__
<p class="mw-customtoggle-Introduction" style="color:blue;margin-left:20px;">'''Introduction'''</p>  
+
<!--INTRODUCTION-->
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-Introduction">
+
<p class="mw-customtoggle-introduction" style="color:blue; cursor:pointer;">[[File:TAChartIntro.png]]  '''Introduction'''</p>  
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-introduction">
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
+
<li>[[TAChart|'''About''']]
<li>C
+
<li>[[TAChart#Screenshot|'''Gallery''']]
<li>D
+
<li>[[TAChart_Tutorial:_Getting_started|'''How to get started''']]
 
</ul>
 
</ul>
<p class="mw-customtoggle-chart" style="color:blue;margin-left:20px;">'''Understanding the Chart'''</p>  
+
 
 +
<!--CHART-->
 +
<p class="mw-customtoggle-chart" style="color:blue; cursor:pointer;">[[File:TAChartScreen.png]]  '''Controlling the Chart'''</p>  
 
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-chart">
 
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-chart">
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<li>[[File:TAChartBasics.png]] [[TAChart_documentation#Overview|'''Basics''']]
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
+
<li>[[File:TAChartLegend.png]] [[TAChart_documentation#Legend|'''The Legend''']]
<li>C
+
<li>[[File:TAChartMarks.png]] [[TAChart_documentation#Marks|'''Adding Marks''']]
<li>D
+
<li>[[File:TAChartAxis.png]] [[TAChart_documentation#Coordinates_and_axes|'''Managing Axes''']]
 +
<li>[[File:TAChartExtent.png]] [[TAChart_documentation#Extents_and_margins|'''Controlling Extent''']]
 
</ul>
 
</ul>
<p class="mw-customtoggle-series" style="color:blue;margin-left:20px;">'''Working the Series'''</p>  
+
 
 +
<!--SERIES-->
 +
<p class="mw-customtoggle-series" style="color:blue; cursor:pointer;">[[File:TAChartSeries.png]] '''Working with Series'''</p>  
 
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-series">
 
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-series">
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<li>[[File:TAChartBasics.png]] [[TAChart_documentation#Series|'''Basics''']]
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
+
<p class="mw-customtoggle-seriestypes" style="color:blue; cursor:pointer;">[[File:TAChartSeriesTypes.png]]  '''Series Types'''</p>
<li>C
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-seriestypes">
<li>D
+
<li>[[File:TAChartBasics.png]] [[TAChart_documentation#Series|'''Common info''']]
 +
<li>[[TAChart_documentation#Basic_series|'''Basic Series''']]
 +
<li>[[TAChart_documentation#Line_series|'''Line Series''']]
 +
<li>[[TAChart_documentation#Bar_series|'''Bar Series''']]
 +
<li>[[TAChart_documentation#Area_series|'''Area Series''']]
 +
<li>[[TAChart_documentation#Pie_series|'''Pie Series''']]
 +
<li>[[TAChart_documentation#Bubble_series|'''Bubble Series''']]
 +
<li>[[TAChart_documentation#Open-high-low-close_series|'''OHLC Series''']]
 +
<li>[[TAChart_documentation#Polar_series|'''Polar Series''']]
 +
<li>[[TAChart_documentation#Color_map_series|'''Color Map Series''']]
 +
<li>[[TAChart_documentation#Box-and-whiskers_series|'''Box & Whiskers Series''']]
 +
<li>[[TAChart_documentation#Fit_series|'''Least Square Fit Series''']]
 +
<li>[[TAChart_documentation#Function_series|'''Function Series''']]
 +
<li>[[TAChart_documentation#B-spline_series|'''B-Spline Series''']]
 +
<li>[[TAChart_documentation#Cubic_spline_series|'''Cubic Spline Series''']]
 +
<li>[[TAChart_documentation#Constant_line_series|'''Constant Line Series''']]
 +
<li>[[TAChart SeriesTypes|'''Parametric Curve Series''']]
 +
<li>[[TAChart SeriesTypes|'''Manhattan Plot Series''']]
 +
<li>[[TAChart_documentation#User-drawn_series|'''User-drawn Series''']]
 
</ul>
 
</ul>
<p class="mw-customtoggle-axes" style="color:blue;margin-left:20px;">'''Managing Axes'''</p>  
+
<p class="mw-customtoggle-sources" style="color:blue; cursor:pointer;">[[File:TAChartSources.png]]  '''Data Sources'''</p>  
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-axes">
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-sources">
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<li>[[TAChart_documentation#Sources|'''General information''']]
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
+
<li>[[TAChart_documentation#List_source|'''List Source''']]
<li>C
+
<li>[[TAChart_documentation#Random_source|'''Random Source''']]
<li>D
+
<li>[[TAChart_documentation#Calculated_source|'''Calculated Source''']]
 +
<li>[[TAChart_documentation#Database_source|'''Database Source''']]
 +
<li>[[TAChart_Tutorial:_Userdefined_ChartSource|'''User defined Source''']]
 +
<li>[[TAChart_documentation#Date-time_interval_source|'''DateTime Interval Source''']]
 
</ul>
 
</ul>
<p class="mw-customtoggle-components" style="color:blue;margin-left:20px;">'''The component suite'''</p>
 
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-components">
 
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
 
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
 
<li>C
 
<li>D
 
</ul>
 
 
 
 
 
 
 
 
 
<div class="mw-customtoggle-myDivision" style="background:#e0e8ff Text:#e0e8ff">'''Introduction'''</div>
 
 
<div class="mw-collapsible mw-collapsed" id="mw-customcollapsible-myDivision">
 
<div class="toccolours mw-collapsible-content">
 
<ul>
 
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
 
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
 
<li>C
 
<li>D
 
</ul></div></div>
 
 
<div class="mw-customtoggle-myDivision" style="background:#e0e8ff Text:#e0e8ff">'''Introduction'''</div>
 
 
<div class="mw-collapsible mw-collapsed" id="mw-customcollapsible-myDivision">
 
<div class="toccolours mw-collapsible-content">
 
Lorem ipsum dolor sit amet...
 
<ul>
 
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
 
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
 
<li>C
 
<li>D
 
</ul></div></div>
 
 
 
 
<div class="mw-customtoggle-myDivision" style="background:#e8ffe0">Clicking will toggle it also!</div>
 
 
 
 
<div class="toccolours mw-collapsible mw-collapsed" style="width:800px">
 
<big>Introduction</big>
 
<div class="mw-collapsible-content">
 
<ul>
 
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
 
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
 
<li>C
 
<li>D
 
 
</ul>
 
</ul>
</div>
 
  
</div>
+
<!--TOOLS-->
 
+
<p class="mw-customtoggle-tools" style="color:blue; cursor:pointer;">[[File:TAChartTools.png]]  '''Using Tools'''</p>  
<big>class="mw-collapsible-content">Blah...</big>
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-tools">
 
+
<li>[[TAChart_documentation#Tools|'''General information''']]
<div style="clear:both"></div>
+
<li>[[TAChart_Tutorial:_Chart_Tools|'''Detailed information''']]
 
+
<li> <p class="mw-customtoggle-toolszoom" style="color:blue; cursor:pointer;">'''Zooming'''</p>  
<div class="usermessage mw-customtoggle-myList0">Introduction</div>
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-toolszoom">
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-myList0">
+
<li>[[TAChart_documentation#Zoom_drag_tool|'''Zoom By Drag''']]
 
+
<li>[[TAChart_documentation#Zoom_click_tool|'''Zoom By Click''']]
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<li>[[TAChart_documentation#Zoom_mouse-wheel_tool|'''Zoom By MouseWheel''']]
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
 
<li>C
 
<li>D
 
 
</ul>
 
</ul>
 
+
<li> <p class="mw-customtoggle-toolspan" style="color:blue; cursor:pointer;">'''Panning'''</p>  
 
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-toolspan">
<div class="usermessage mw-customtoggle-myList1">Introduction</div>
+
<li>[[TAChart_documentation#Pan_drag_tool|'''Pan By Drag''']]
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-myList1">
+
<li>[[TAChart_documentation#Pan_click_tool|'''Pan By Click''']]
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<li>[[TAChart_documentation#Pan_mouse_wheel_tool|'''Pan By MouseWheel''']]
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
 
<li>C
 
<li>D
 
 
</ul>
 
</ul>
 
+
<li> <p class="mw-customtoggle-toolsdatatool" style="color:blue; cursor:pointer;">'''Data Tools'''</p>  
<div class="usermessage mw-customtoggle-myList2">Understanding the Chart</div>
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-toolsdatatool">
<ul class="mw-collapsible mw-autocollapse" id="mw-customcollapsible-myList2">
+
<li>[[TAChart_documentation#Data_point_drag_tool|'''Datapoint Drag''']]
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<li>[[TAChart_documentation#Data_point_click_tool|'''Datapoint Click''']]
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
+
<li>[[TAChart_documentation#Data_point_hint_tool|'''Datapoint Hint''']]
<li>C
+
<li>[[TAChart_documentation#Data_point_crosshair_tool|'''Datapoint CrossHair''']]
<li>D
 
 
</ul>
 
</ul>
 
+
<li>[[TAChart_documentation#Reticule_tool|'''Reticule''']]
<div class="usermessage mw-customtoggle-myList3">Working with Series</div>
+
<li>[[TAChart_documentation#User_defined_tool|'''User Defined''']]
<ul class="mw-collapsible mw-autocollapse" id="mw-customcollapsible-myList3">
+
<li>[[TAChart_documentation#Data_point_distance_tool|'''Distance Measurement''']]
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
 
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
 
<li>C
 
<li>D
 
 
</ul>
 
</ul>
  
<div class="usermessage mw-customtoggle-myList4"><big>TAChart Introduction</big></div>
+
<!--RESOURCES-->
<ul class="mw-collapsible mw-autocollapse" id="mw-customcollapsible-myList4">
+
<p class="mw-customtoggle-resources" style="color:blue; cursor:pointer;">[[File:TAChartResources.png]]  '''Resources'''</p>  
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-resources">
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
+
<li>[[TAChart#Documentation|'''Tutorials''']]
<li>C
+
<li>[[http://forum.lazarus.freepascal.org/index.php/board,55.0.html|'''The Forum''']]
<li>D
+
<li>[[TAChart Demos|'''Demo Applications''']]
 +
<li>[[TAChart FAQ|'''Frequently asked questions''']]
 +
<li>[[TAChart Glossary|'''Glossary''']]
 +
<li>[[TAChart Reference|'''Reference''']]
 
</ul>
 
</ul>
  
<div class="usermessage mw-customtoggle-myList5"><big>TAChart Introduction</big></div>
+
<!--INDEX-->
<ul class="mw-collapsible mw-autocollapse" id="mw-customcollapsible-myList5">
+
<p class="mw-customtoggle-index" style="color:blue; cursor:pointer;">[[File:TAChartIndex.png]]  '''Index'''</p>  
<li>[[TAChart QuickStart|'''Quick start to TAChart''']]
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-index">
<li>[[TAChart FindAnswer|'''How to find answers to questions''']]
+
<li>[[TAChart L1Item1|'''A''']]
<li>C
+
<li>[[TAChart L1Item2|'''B''']]
<li>D
+
<li>[[TAChart L1Item1|'''C''']]
 
</ul>
 
</ul>
 
 
<div style="clear:both"></div>
 
 
<div id="collapse-pre-one" class="mw-collapsible mw-collapsed"><div class="mw-collapsible-toggle toccolours" style="float: none;"><span class="down"> '''Introduction'''</span></div>
 
<div class="mw-collapsible-content">
 
#[[TAChart QuickStart|'''Quick start to TAChart''']]
 
#[[TAChart FindAnswer|'''How to find answers to questions''']]
 
</div></div>
 
 
<div id="collapse-pre-one" class="mw-collapsible mw-collapsed"><div class="mw-collapsible-toggle toccolours" style="float: none;"><span class="down"> Text...</span></div>
 
<div class="mw-collapsible-content">
 
#[[TAChart QuickStart|'''Quick start to TAChart''']]
 
#[[TAChart FindAnswer|'''How to find answers to questions''']]
 
 
</div></div>
 
 
 
 
<br>
 
<br>
 
----
 
<div class="mw-collapsible mw-autocollapse" data-collapsetext="Introduction" data-expandtext="Introduction">
 
#[[TAChart QuickStart|'''Quick start to TAChart''']]
 
#[[TAChart FindAnswer|'''How to find answers to questions''']]
 
</div>
 
 
<br>
 
<br>
 +
<p style="font-size:x-small;text-align:left;">Last edited by [[User:{{REVISIONUSER}}|{{REVISIONUSER}}]] @{{REVISIONTIMESTAMP}}</p>
  
<big>''' Collapsible div '''</big>
 
----
 
<div class="mw-collapsible mw-autocollapse" data-collapsetext="Introduction" data-expandtext="Introduction">
 
#[[TAChart QuickStart|'''Quick start to TAChart''']]
 
#[[TAChart FindAnswer|'''How to find answers to questions''']]
 
</div>
 
<br>
 
__NOTOC__
 
  
<big>''' Collapsible div '''</big>
+
<!-- <p class="mw-customtoggle-axes" style="color:blue; cursor:pointer;">''' Managing Axes'''</p>  
----
+
<ul class="mw-collapsible mw-collapsed" id="mw-customcollapsible-axes">
<div class="mw-collapsible" data-collapsetext="You may collapse me by clicking here" data-expandtext="Let me back out !">
+
<li>[[TAChart Axes_General|''' General information''']]
{{User:Krinkle/Lorem}}
 
</div>
 
<br>
 
__NOTOC__
 
 
 
<big>''' Collapsible div '''</big>
 
----
 
<div class="mw-collapsible" data-collapsetext="You may collapse me by clicking here" data-expandtext="Let me back out !">
 
{{User:Krinkle/Lorem}}
 
</div>
 
<br>
 
= Test suite for mw-collapsible =
 
__NOTOC__
 
 
 
 
 
<div style="clear:both"></div>
 
 
 
<big>''' Combination example '''
 
----
 
<ul class="mw-collapsible mw-autocollapse" data-collapsetext="Introduction" data-expandtext="Introduction">
 
</big>
 
<li>[[TAChart Reference|'''Reference''']]
 
<li>Quick Start Charting
 
<li>Third row contains a collapsible block with custom labels
 
</ul>
 
 
 
{| class="wikitable plainlinks mw-collapsible mw-collapsed"
 
!colspan="3" | <strong class="mw-collapsible-toggle mw-collapsible-toggle-expanded" style="color:#FF00EE;float:none">Collapse</strong> '''{{FULLPAGENAME}}'''
 
|-
 
|width="14%" | #1
 
|
 
Hello, [{{fullurl:{{FULLPAGENAME}}|action=edit}} edit this page]
 
Hello, [{{fullurl:{{FULLPAGENAME}}|action=purge}} purge this page]
 
Hello, [{{fullurl:{{TALKPAGENAME}}|action=edit&section=new}} add new section to talkpage]
 
|width="14%"| [[File:Example.svg|25x25px]]
 
|-
 
|width="14%" | #2
 
|
 
<ul class="mw-collapsible">
 
<li>Lorem
 
<li>Ipsum
 
<li>Dolor
 
 
</ul>
 
</ul>
|width="14%"| [[File:Example.svg|25x25px]]
 
|-
 
|width="14%" | #3
 
|
 
There's a lot more secret content hidden !
 
<div style="background:red" class="mw-collapsible mw-collapsed" data-collapsetext="Hide me" data-expandtext="Reveal me">
 
'''This following code is top secret:'''<br />
 
: ''kmnd ihwkxucnskdf''
 
</div>
 
|width="14%"| [[File:Example.svg|25x25px]]
 
|-
 
|colspan=3 style="text-align:center"|Last edited by [[User:{{REVISIONUSER}}|{{REVISIONUSER}}]] on {{REVISIONTIMESTAMP}}
 
|-
 
|colspan=3 style="text-align:center"|[{{fullurl:{{FULLPAGENAME}}|oldid={{REVISIONID}}}} Permalink to this revision]
 
|}
 
 
<br>
 
=== Collapsible tables ===
 
Classes can also be used to collapse tables, so they are hidden by default.  Use the style 'collapsible' to enable collapsing behaviour.  By default, a collapsible table will begin expanded.  To change this, include the additional class 'collapsed' or 'autocollapse' (i.e. only collapse if 3 other collapsible tables are present). You must include a header row, where the 'hide' option will be displayed. Example:
 
 
<pre style="display: inline-block;">
 
{| class="wikitable collapsible collapsed"
 
|-
 
! Header
 
|-
 
| Content which starts hidden
 
|-
 
| more hidden content
 
|}
 
</pre>
 
 
Gives:
 
 
{| class="wikitable collapsible collapsed"
 
|-
 
! Header
 
|-
 
| Content which starts hidden
 
|-
 
| more hidden content
 
|}
 
 
==== Using class mw-collapsible ====
 
Another way (worked in mediawiki 1.19rc1)[[testwiki:User:Krinkle/CollapsingTestpageMw]]
 
<pre style="display: inline-block;">{| class="wikitable sortable mw-collapsible"</pre>
 
 
{| class="wikitable sortable mw-collapsible"
 
|-
 
! Header
 
|-
 
| Content which starts visible
 
|-
 
| more visible content
 
|}
 
 
<pre style="display: inline-block;">{| class="wikitable sortable mw-collapsible mw-collapsed"</pre>
 
{| class="wikitable sortable mw-collapsible mw-collapsed"
 
|-
 
! Header
 
|-
 
| Content which starts hidden
 
|-
 
| more hidden content
 
|}
 
 
<br><br>
 
''All TAChart information on the Wiki can be linked to this catalog as a means of easy access to everything.''
 
<br>
 
How to contribute information to this guide.
 
<br>
 
<br>
 
{| class="wikitable collapsible collapsed"
 
|-
 
! Understanding the Chart
 
|-
 
| Blah 1
 
|-
 
| Blah 2
 
|}
 
<br>
 
<!-- * [[TAChart Part One|'''Part One''']]
 
 
# [[TAChart|'''Introduction''']]
 
 
# [[TAChart Add_Series_id|'''Adding a Series''']]
 
# [[TAChart Tutorial: Getting started|'''Getting started''']]
 
# [[TAChart Beginner#Beginner_id|'''Beginner''']]
 
# [[TAChart Intermediate|'''Intermediate''']]
 
# [[TAChart Advanced|'''Advanced''']]
 
# [[TAChart_User_Guide: Component Palette|'''Component Palette''']]
 
# [[TAChart Demos|'''Demos''']]
 
 
-->
 
-->
 
# [[TAChart|'''Introduction''']]
 
##[[TAChart QuickStart|'''Quick start to TAChart''']]
 
##[[TAChart FindAnswer|'''How to find answers to questions''']]
 
# [[TAChart Understanding_Chart|'''Understanding the Chart''']]
 
# [[TAChart Working_Series|'''Working with Series''']]
 
# [[TAChart Axes|'''Managing Axes''']]
 
# [[TAChart ComponentSuite|'''The Component Suite''']]
 
# [[TAChart TutDemos|'''Tutorials & Demos''']]
 
# [[TAChart Forum|'''Forum''']]
 
# [[TAChart Gallery|'''Gallery''']]
 
# [[TAChart Glossary|'''Glossary''']]
 
# [[TAChart Index|'''Index''']]
 
# [[TAChart Reference|'''Reference''']]
 
 
<br><br><br>
 
 
Chapters with Code Examples: a few lines of code or codelisting to exemplify the use of what was just described
 
  
 
[[Category:Lazarus]]
 
[[Category:Lazarus]]
[[Category:Components]]
 
 
[[Category:Graphics]]
 
[[Category:Graphics]]
 +
[[Category:TAChart]]

Latest revision as of 02:50, 7 December 2022