AreaLayer

間隙を埋める領域を使用してデータ系列をプロットする ChartLayer の実装。

説明

既定では、AreaLayer.y-axis-data の各メンバ内のそれぞれのレコードについて、AreaLayer は一つ以上の RegionShape を生成します。生成された Shape は AreaLayer.series-shapes で見つかります。

Shape の外観と動作はいくつかの方法でカスタマイズできます。最も簡単な方法はオプションを使用することです。他のグラフコンポーネントの場合と同様、Shape は、それがある場所またはその上のどこにでも非ローカルオプションセットを使用して制御することができます。たとえば、area-border-width を設定すれば、生成された RegionShape の境界線の太さを変更できます。

また、AreaLayer.shape-factory を使用すれば、Shape の作成プロセスをオーバーライドすることもできます。これは非常に用途の広い手法です。これを使用すれば、個々の Shape のオプション値を変更したり、Shape の Tooltip を提供したり、まったく種類の異なる Shape を一緒に生成したりさえできます。

これは、ChartLayer の標準実装の 1 つです。他の標準実装の一覧、および LayeredChart システムの詳細については、LayeredChart を参照してください。

注意事項

グラフへのその他のオブジェクトの追加については、ChartLayer を参照してください。

次の非ローカルオプションは、特に AreaLayer に関連しています。

このオブジェクトは、"AreaLayer"のスタイルルールを記述することによってスタイル化することが出来ます。

例

この例では、AreaLayer レベルでの非ローカルオプションの使用法を示すとともに、追加の Shape を作成するための AreaLayer.shape-factory の高度な使用法をヒント付きで示しています。

例

{import * from CURL.GUI.CHARTS}
{import * from CHARTS-DOC,
    location = "../docstring-support/gui/charts-doc.scurl"
}

{let chart:LayeredChart =
    {LayeredChart
        width = 15cm,
        height = 6cm,
        {AreaLayer
            sample-records,
            "Age",
            "Points",
            x-axis-data = {ChartDataSeries sample-records, "Name"},
            stroke-thickness = 3pt,
            shape-factory =
                {proc
                    {layer:AreaLayer,
                     points:{FastArray-of PointRecordPair},
                     series-index:int,
                     border-width:any,
                     border-line-style:LineStyle
                    }:Shape
                    
                    let constant stock-shape:Shape =
                        {AreaLayer.default-shape-factory
                            layer,
                            points,
                            series-index,
                            border-width,
                            border-line-style
                        }
                    let constant fill-pattern:FillPattern =
                        {layer.get-fill-pattern-for-data-series series-index}

                    {for point in points do
                        {stock-shape.add
                            {RectangleShape
                                {GRect 3pt, 3pt, 3pt, 3pt},
                                translation = point.point,
                                rotation = 45deg,
                                color = {darker-fill-pattern fill-pattern},
                                border-width = 1.5pt,
                                border-color = FillPattern.silver,
                                tooltip =
                                    {Tooltip
                                        style = TooltipStyle.immediate,
                                        {value
                                            def fname =
                                                layer.y-axis-data[series-index].field.name
                                            {format "%s: %s = %g",
                                                point.record["Name"],
                                                fname,
                                                point.record[fname]
                                            }
                                        }
                                    }
                            }
                        }
                    }
                    {return stock-shape}
                }
        }
    }
}

{AntialiasedFrame chart}

プロパティ継承 StackableChartLayer: generate-y-axes?, stacking-mode

プロパティ継承 ChartLayer: chart, color-associations, legend-enabled?, legend-entry-factory, x-axis-data, y-axis-data

プロパティ継承 Shape: as-Shape, border-color, color, draw-operation, graphical-parent, option-parent, possibly-displayed?, selection-context, shape-parent, shape-selectable, stroke-thickness, transformation, visible?

プロパティ継承 ShapeContainerBase: as-ShapeRoot, shape-children

プロパティ継承 Visual: _style-element, clonable-class?, completely-clonable-children?, cursor, data-source, display-context, dragee, font-size, has-key-focus?, input-method-enabled?, input-method-keyboard-mode, name, options, style-class, style-manager, style-options, test-child?, test-description, test-name, test-parent?, test-type-name, test-visible?, tooltip, user-data, visual-parent

プロパティ継承 DataBindingTarget: data-binding-context, data-bindings

プロパティ継承 EventTarget: event-handlers

プロパティ継承 OptionListInterface: option-register-proc, options-present-here, registered-option-keys

メソッド継承 StackableChartLayer: append-data-series, compute-data-min-max, get-data-mapping, get-inverse-data-mapping

メソッド継承 ChartLayer: append-color-association, create-legend-entries, detach, draw, get-data-series-visibility, get-fill-pattern-for-data-series, get-nearest-record-in-data, get-own-bounds, get-record-at-point, get-record-count, handle-observer-message, maybe-create-x-axis, maybe-create-y-axis-for-series, non-keyword-init-arg, note-color-associations-changed, note-y-axis-data-array-changed, remove-color-association, remove-data-series, self-contains-point?, self-intersects-polygon?

メソッド継承 Shape: apply-rotation, apply-scale, apply-transformation, apply-translation, apply-translation-in-parent, constrain-own-layout-bounds, constrain-shape-layout-bounds, contains-point?, find-graphical-ancestor, fire-crossing-event, fire-in-child, get-display-context, get-down-orientation-in-shape-parent, get-graphical-root, get-gui-path, get-gui-path-to-child, get-local-device-pixel-size, get-origin-in-graphical-ancestor, get-origin-in-root, get-origin-in-shape-parent, get-origin-in-shape-root, get-own-bounds-in-shape-root, get-own-layout-bounds, get-right-orientation-in-shape-parent, get-shape-bounds, get-shape-bounds-in-shape-root, get-shape-layout-bounds, get-top-left-in-ancestor, get-transformation-to-shape-root, keyword-init-arg, option-change-notify, overdraw-for-selection, quantize-line-thickness, request-draw, request-draw-self, reset-transformation, set-rotation, set-scale, set-transformation, set-translation-in-parent, to-Graphic, transform-from-display-coordinates, transform-from-graphical-root-coordinates, transform-point-from-shape-root, transform-point-to-shape-root, transform-to-display-coordinates, transform-to-graphical-root-coordinates, transform-vector-from-shape-root, transform-vector-to-shape-root, transformation-changed, transformation-changing

メソッド継承 Observer: observe, stop-observing

メソッド継承 ShapeContainerBase: add, clear, clone-children, draw-shape-child, draw-shape-children, get-all-children-at-point, get-child-at-point, get-leaf-at-point, get-shape-root, note-attached, note-detaching, notify-option-children, on-drag-enter, on-pointer-enter, on-pointer-envelope-event, register-options, remove, set-shape-index, set-shape-index-after, set-shape-index-before, shape-container-fire-inferior-crossing-event, shape-container-handle-crossing, shape-container-pick-child, shape-container-pointer-enter-occurred, shape-container-pointer-leave-occurred

メソッド継承 Visual: add-from-init-args, animate, change-cursor, clonable-appearance?, clone-appearance, clone-appearance-helper, find-test-children, get-focus-manager, get-layout-context, get-test-parent, get-test-property, get-text, get-view, maybe-fire-attach-event, maybe-fire-detach-event, note-caret-position, on-drag-leave, on-pointer-leave, pop-cursor, prepare-test-object, prepare-test-parent, push-cursor, quantize-width, refresh-style-options, release-key-focus, request-key-focus, scroll-to-include, test-record, test-run, xy-offset-to

メソッド継承 GraphicOptions: any-to-Distance

メソッド継承 GuiEventTarget: handle-delegate-event, handle-event, on-action, on-cancel-mode, on-command-changed, on-commit, on-composition-change-event, on-composition-result-event, on-context-menu-event, on-current-record-change-request, on-current-record-changed, on-destroy-notify, on-destroy-requested, on-drag-over, on-drag-pointer, on-drag-started, on-drop, on-end-composition-event, on-focus-event, on-focus-in, on-focus-out, on-gesture, on-gesture-begin, on-gesture-end, on-gesture-magnify, on-gesture-pan, on-gesture-rotate, on-gesture-swipe, on-gesture-tap, on-gesture-touch, on-grab-release, on-gui-event, on-input-method-event, on-inspection, on-key-event, on-key-press, on-pointer-button, on-pointer-crossing, on-pointer-event, on-pointer-motion, on-pointer-press, on-pointer-release, on-pointer-scroll, on-raw-key-event, on-raw-key-press, on-raw-key-release, on-reset, on-selectable-added, on-selectable-removed, on-selection-changed, on-selection-context-activated, on-selection-context-deactivated, on-selection-event, on-start-composition-event, on-start-event, on-stop-event, on-view-activate, on-view-deactivate, on-window-close, remove-event-handlers-for-event-class

メソッド継承 DataBindingTarget: add-data-binding, get-data-binding, refresh-data-binding, remove-data-binding, unset-property, update-data-binding, validate-data-binding

メソッド継承 EventTarget: accepts-event-class?, add-event-handler, event-handler-present?, remove-event-handler, verify-event

メソッド継承 OptionListInterface: add-option, add-style-option, change-option-parent-notify, clone-options, get-option, get-option-by-name, local-add-notify, local-remove-notify, name-to-option-key, new-option-item, option-changed, option-lookup, option-lookup-here, option-propagate-notify, option-set?, propagate-option-change, remove-option, remove-style-option, remove-styles, set-option-by-name, set-style-option-by-name, unset-option-by-name, unset-style-option-by-name

メソッド継承 BasicEventTarget: enqueue-event

メソッド継承 InitRestArgParser: process-rest-args

メソッド継承 Object: object-describe, object-describe-for-debugging, object-serialize

default (コンストラクタ)

新規の AreaLayer を作成します。

x-axis-data: ChartLayer.x-axis-data の初期値。この値は、指定されると、LayeredChart での自動 X 軸生成を変更するために使用されます。

stacking-mode: このグラフの初期 ChartStackingMode。ChartStackingMode.none 以外のスタッキングモードでは許可されるデータの型に制約が生じることに注意してください。詳細については、AreaLayer.stacking-mode を参照してください。

shape-factory: AreaLayer.shape-factory の初期値。このプロシージャは、プロットする Shape の作成を制御します。AreaLayer.ShapeFactory も参照してください。

border-color: この ChartLayer での Shape.border-color オプションの初期値。

...: データ系列、オプション、および他の項目の初期化の値。詳細については、ChartLayer.default を参照してください。

例

例は、AreaLayer を参照してください。

area-border-line-style (非ローカルオプション)

area-border-width (非ローカルオプション)

series-shapes (フィールド)

この AreaLayer のプロットを表す Shape を含む配列。

説明

この配列には、AreaLayer.y-axis-data 内のChartDataSeries ごとに 1 つの要素が入ります。これらは、AreaLayer.shape-factory によって返されたオブジェクトであり、Shape が生成される方法を変更するために使用できます。

この配列は、単なるインスペクション用で、変更はできません。要素の順序を変更したり、要素を追加または削除したりしないでください。また、その内容は、グラフのレイアウト処理が行われるたびに変更されます。そのため、レイアウト処理が行われて初めてその内容が有効になります。EventHandler を ChartLayoutChanged に対して使用し、これらの値が変更された時点で通知を受け取ることができます。

この配列内の Shape オブジェクトの変更は許可されます。ただし、一般的に AreaLayer.shape-factory にファクトリープロシージャを提供して同じことを行うほうがはるかに容易です。レイアウトが変更された時点や形状の更新が必要となる時点を考慮する必要がないので、この手法をお勧めします。

shape-factory (アクセサ)

この AreaLayer 内の各プロット Shape を生成するために使用されるファクトリプロシージャ。

説明

独自のプロシージャを提供して、プロットの実行方法を変更できます。このプロシージャは、データ系列ごとに 1 回呼び出されます。(これは、他のほとんどの形状ファクトリーとは対照的です。これらの場合、通常、データポイントごとに 1 回呼び出されます。)引数の 1 つは、系列の各データポイントの項目を含む配列です。プロシージャの引数については、AreaLayer.ShapeFactory を参照してください。

形状ファクトリを変更することは、オプション設定が十分でない場合に、プロットの外観を変更するためには、望ましいメソッドです。たとえば、AreaLayer.series-shapes の内容を変更することは望ましい方法です。形状が再生成される場合は常にファクトリーが必ず呼び出されることが 1 つの理由です。一方、このようにしないと、独自にそれを追跡する必要があります。

既定の形状ファクトリーは AreaLayer.default-shape-factory です。一般的な方法では、ファクトリープロシージャを定義して、既定のファクトリーを呼び出してから、結果を変更します。たとえば、Visual.tooltip などのオプションを変更できます。ただし、この手法を用いて系列の色を変更することはお勧めできません。グラフの凡例ではこの変更が表示されないためです。代わりに、Chart.color-palette または ChartLayer.color-associations を使用してください。

例

{import * from CURL.GUI.CHARTS}
{import * from CHARTS-DOC,
    location = "../docstring-support/gui/charts-doc.scurl"
}

{let chart:LayeredChart =
    {LayeredChart
        width = 15cm,
        height = 6cm,
        legend-location = "right",
        {AreaLayer
            sample-records,
            "Age",
            "Points",
            x-axis-data = {ChartDataSeries sample-records, "Name"},
            shape-factory =
                {proc
                    {layer:AreaLayer,
                     points:{FastArray-of PointRecordPair},
                     series-index:int,
                     border-width:any,
                     border-line-style:LineStyle
                    }:Shape
                    
                    let constant shape:Shape =
                        {AreaLayer.default-shape-factory
                            layer,
                            points,
                            series-index,
                            border-width,
                            border-line-style
                        }
                    let constant fill-pattern:FillPattern =
                        {layer.get-fill-pattern-for-data-series series-index}
                    
                    set shape.arrow-body-width = 2px
                    set shape.arrow-head-width = 8px
                    set shape.arrow-head-length = 12px
                    set shape.arrow-head-style = ArrowStyle.solid
                    set shape.arrow-tail-style = ArrowStyle.none
                    set shape.font-size = 8pt

                    {for point key idx in points do
                        {if idx < points.size - 1 then
                            {shape.add
                                {ArrowShape
                                    point.point,
                                    points[idx + 1].point,
                                    color = FillPattern.white,
                                    border-width = 1px,
                                    {EllipseShape
                                        {GRect 5pt, 5pt, 5pt, 5pt},
                                        translation = point.point,
                                        color = {lighter-fill-pattern fill-pattern},
                                        {TextShape
                                            {format "%.g", point.record["Points"]},
                                            color = FillPattern.black,
                                            valign = "center"
                                        }
                                    }
                                }
                            }
                        }
                    }
                    {return shape}
                }
        }
    }
}

{AntialiasedFrame chart}

style-element (アクセサ)

スタイリングの目的のための、この Visual の "要素" や "型" です。

説明

この実装によって Visual._style-elementの値が返されますが、通常は定数を返すためにオーバーライドされます。

オーバーライド

Visual のサブクラスのスタイルが他のオブジェクトと異なる場合、このゲッターは適切な文字列を返すようにオーバーライドされる必要があります。慣例では,この文字列はクラス名または、オブジェクトを生成するマークアップの名前です。

オーバーライドでは、空の文字列でないかぎり、self._style-elementを返さなければなりません。

導入: バージョン 6.0

ShapeFactory (クラス定数)

AreaLayer Shape 要素の生成に使用されるファクトリープロシージャの Type。これは、オプション AreaLayer.shape-factory の型です。

layer: Shape 生成が実行される AreaLayer。

points: 表示する各ポイントを記述する PointRecordPair オブジェクトの配列。各要素は、位置、レコード、およびレコードインデックスを含みます。これらは X 軸に沿って昇順に並べ替えられます (これは、LayeredChart.flipped? の値に応じて、X 座標の増大または Y 座標の減少に対応します)。

series-index: layer.y-axis-data へのインデックスによって表わされたプロットされる ChartDataSeries。

border-width: Shape の生成で使用される境界幅。この値は、area-border-width から取得されます。

border-line-style: Shape の生成で使用される境界 LineStyle。この値は、area-border-width から取得されます。

戻り値

AreaLayer に追加される Shape (通常は RegionShape)。具体的には、この値は AreaLayer.series-shapes のメンバになります。

説明

このタイプの詳細およびその使用例については、AreaLayer.shape-factory を参照してください。

default-shape-factory (クラスプロシージャ)

AreaLayer.shape-factory の既定値。

layer: Shape 生成が実行される AreaLayer。

series-index: layer.y-axis-data へのインデックスによって表わされたプロットされる ChartDataSeries。

border-width: Shape の生成で使用される境界幅。この値は、area-border-width から取得されます。

border-line-style: Shape の生成で使用される境界 LineStyle。この値は、area-border-width から取得されます。

戻り値

points を表す Shape。

説明

このプロシージャは、points から、一つ以上の RegionShape を作成します。points を表現するために、一つ以上の RegionShape が必要とされる場合、収容している ShapeGroup が返されます。形状に色を提供するには、AreaLayer.get-fill-pattern-for-data-series を参照してください。

ゼロから作成するのではなく、既存の形状を変更する場合、一般的には、ユーザーの形状ファクトリプロシージャから、このプロシージャを呼び出します。AreaLayer の例を参照してください。

get-data-series-from-shape (メソッド)

Shape に関連した ChartDataSeries を決定します (ある場合)。

shape: 検索する Shape。

説明

ChartLayer.y-axis-data の要素を表すために、Shape がこの ChartLayer によって生成された場合は、このメソッドでその要素が判別され、該当するデータ系列が返されます。その他の場合は、null を返します。

ChartLayer をサブクラス化しようとする場合は、このメソッドを実装する必要があります。これは通常、生成された Shape のセットを追跡し、渡される Shape が既知の Shape のメンバであるかどうかを決定することにより実行されます。

set-data-series-visibility (メソッド)

ChartLayer.y-axis-data の個々のメンバの表示を制御します。

data-series-index: 変更するデータ系列で、ChartLayer.y-axis-data へのインデックスとして表わされます。

visible?: data-series-index によって参照されるデータ系列が表示されない場合は、false です。

説明

これは、凡例メンバや既存の系列の色を変更せずにデータの可視性を制御する場合に役立ちます。この実装は ChartLayer サブクラスによって実行されます。標準グラフレイヤは Shape.visible? を使用して可視性を制御します。独自のサブクラス内でこのメソッドを実装する場合、必ずスーパークラスの実装を呼び出す必要があります。

例

例: ChartLayer.set-data-series-visibility の使用

{import * from CURL.GUI.CHARTS}
{import * from CHARTS-DOC,
    location = "../docstring-support/gui/charts-doc.scurl"
}

{let chart:LayeredChart =
    {LayeredChart
        width = 12cm,
        height = 6cm,
        {LineLayer
            sample-records,
            "Age",
            "Points",
            "Height",
            x-axis-data = {ChartDataSeries sample-records, "Name"},
            symbols-at-data-points? = true
        }
    }
}

{value chart}

{CheckButton
    label = "Show Age?",
    value = true,
    {on ValueFinished at cb:CheckButton do
        let layer:ChartLayer = chart.layers[0]
        {layer.set-data-series-visibility 0, cb.value}
    }
}

{CheckButton
    label = "Show Points?",
    value = true,
    {on ValueFinished at cb:CheckButton do
        let layer:ChartLayer = chart.layers[0]
        {layer.set-data-series-visibility 1, cb.value}
    }
}

{CheckButton
    label = "Show Height?",
    value = true,
    {on ValueFinished at cb:CheckButton do
        let layer:ChartLayer = chart.layers[0]
        {layer.set-data-series-visibility 2, cb.value}
    }
}