Telerik UI for Windows 8 XAML

Important

RadChart is available for Windows 8.1 and Windows Phone 8.1.

Chart-Overview-01

RadChart for Windows Universal is a versatile charting component that has been specifically designed from the ground-up with the latest Windows Runtime patterns and practices in mind. It offers unmatched performance regarding loading time, drawing capabilities and real-time updates. Its intuitive object model and public API allow complex charts to be easily setup either in XAML or in code-behind. The control is completely data aware and may work in bound or unbound mode, depending on the requirements. Chart types (or series) are organized in hierarchies, depending on the coordinate system, used to plot data points – for example, we have RadCartesianChart (using the Cartesian coordinate system) and RadPieChart (using the radial coordinate system).

Architecture

A charting component in general is used to visualize (or plot) some data in a human-readable way through different representations like lines, areas, bars, pies, etc. Each series has a collection of data points – the data equivalent of a 2D point – and knows how to visualize them. Different series types may process certain types of data points – for example, categorical series may contain categorical data points. Data points may be added directly to series or a data binding mechanism may be used to create the appropriate data points from the raw data.

  • RadCartesianChart

    As the name hints, this chart control uses the Cartesian coordinate system to plot the data points in its chart series. The X and Y axes define how each point’s coordinates in the plot area are calculated.

    • Axes

      The following Cartesian axes are available:

      • Categorical

        Arranges the plotted data points in categories where the key of each category is the point’s value (if available) for that axis or its index within the points collection. The point’s coordinate, specified by this axis, is discrete and is calculated depending on the size of the category slot where the point resides.

      • Date-time Categorical

        A special categorical axis that expects each data point to provide a System.DateTime structure as its value for this axis. The points are grouped by a user-defined date-time component (Year, Month, Day, etc.) and then the groups are sorted chronologically.

      • Linear

        Calculates the coordinate of each data point, depending on the actual numerical value this point provides for the axis. Exposes Minimum and Maximum properties to allow explicit definition of the range of values visible on this axis. If these properties are not specified, the axis will automatically calculate the range, depending on the minimum and maximum data point values.

      • Logarithmic

        A special linear axis that will transform each data point value using the logarithm function. It allows numerical data with a huge delta between the minimum and the maximum to be visualized in a readable way.

      • Date-Time Continuous

        A special axis that expects each data point to provide a System.DateTime structure as its value for this axis. Think of this axis as a timeline where the coordinate of each data point is calculated depending on the position of its associated DateTime on the timeline. The base unit (or the timeline step) of the axis is calculated depending on the smallest difference between any two dates.

    • Series

      The following Cartesian series are available:

      • Categorical

        Categorical series need a Linear/Logarithmic and a Categorical/DateTimeCategorical/DateTimeContinuous axis in order to get properly plotted.

        • Bar

          Data points are represented by a box where the height (width) of the box is the distance between the point’s numerical value and the categorical axis that plots the point. Bars may be either “horizontal” or “vertical” depending on whether the categorical axis is specified as an “X-axis” or as a “Y-axis”.

        • Line

          Data points are connected with straight line segments.

        • Spline

          Data points are connected with smooth line segments.

        • Area

          Data points and the corresponding coordinate axis enclose an area that may be optionally stroked and/or filled.

        • SplineArea

          An area, where points are connected with smooth rather than straight segments.

        • Candlestick

          A special financial series that present some stock trend(s) in time. Uses candle-like shapes to visualize its data points.

        • OHLC

          A special financial series that present some stock trend(s) in time. Uses stick-like shapes to visualize its data points.

        Each of the above series of the same type may be combined in either stacks or clusters. Combinations are formed when more than one data point from different series fall within the same category. The “Cluster” combine mode will position such points next to each other while the “Stack” combine mode will arrange such points in a stack-like structure. When stacks are formed, the numerical axis (if present) will consider each stack as a single entity and its sum will be the actual value used rather than each point’s one.

      • Scatter

        Scatter series need two linear/logarithmic axes in order to get properly plotted. Scatted data provides both the X and the Y coordinate.

        • ScatterPoint

          Data points are represented by an arbitrary template.

        • ScatterLine

          Data points are connected with straight line segments.

        • ScatterSpline

          Data points are connected with smooth line segments.

        • ScatterArea

          Data points and the horizontal axis enclose an area that may be optionally stroked and/or filled.

        • ScatterSplineArea

          A ScatterArea, where points are connected with smooth rather than straight segments.

    • CartesianChartGrid

      The Cartesian chart may be optionally decorated with grid-like visuals that support horizontal and vertical lines, associated with axis ticks and horizontal and vertical stripes – the area between two adjacent ticks.

  • PieChart

    This chart control visualizes its data points using a discrete polar coordinate system. Each point is represented as an arc segment. The arc’s length represents the point’s value percentage of the total sum.

  • RadPolarChart

    This chart control uses the polar coordinate system to plot its data.

    • Axes

      The following axes are available:

      • CategoricalRadial

        A special categorical axis that arranges its ticks and labels in a circle. Much like the Cartesian CategoricalAxis, it plots the associated data into groups (categories) and the angle coordinate of each point is calculated depending on the category slot position on the circle.

      • NumericalRadialAxis

        A special categorical axis that expects each data point to provide a System.DateTime structure as its value for this axis. The points are grouped by a user-defined date-time component (Year, Month, Day, etc.) and then the groups are sorted chronologically.

      • Polar

        A special numerical axis that calculates the radius value of each data point.

    • Series

      The following series are available:

      • Polar

        Polar series need a NumericalRadial and a Polar axis in order to get properly plotted.

        • PolarPoint

          Data points are represented by an arbitrary template and not connected.

        • PolarLine

          Data points are connected with straight line segments.

        • PolarSpline

          Data points are connected with smooth line segments.

        • PolarArea

          Data points and the corresponding coordinate axis enclose an area that may be optionally stroked and/or filled.

        • PolarSplineArea

          An area, where points are connected with smooth rather than straight segments.

      • Radar

        Radar series need CategoricalRadial and Polar axes in order to get properly plotted.

        • RadarPoint

          Data points are represented by an arbitrary template and not connected.

        • RadarLine

          Data points are connected with straight line segments.

        • RadarSpline

          Data points are connected with smooth line segments.

        • RadarArea

          Data points and the horizontal axis enclose an area that may be optionally stroked and/or filled.

        • RadarSplineArea

          A ScatterArea, where points are connected with smooth rather than straight segments.

    • PolarChartGrid

      The Polar chart may be optionally decorated with grid-like visuals that support horizontal and vertical lines, associated with axis ticks and horizontal and vertical stripes – the area between two adjacent ticks.

  • Behaviors

    Optionally, each chart may be enabled with interactivity through its Behaviors property. A behavior is generally an abstraction that handles user input in a RadChart instance and optionally provides visual feedback upon some action. The following behaviors are available:

    • PanAndZoomBehavior

      This behavior handles Manipulation events and/or MouseMove/MouseWheel to enable panning and zooming of the associated chart plot area.

    • TrackballBehavior

      This behavior handles Hold and/or MouseMove events to enable context-sensitive information about a data point.

    • TooltipBehavior

      This behavior handles Hold and/or MouseMove events to enable context-sensitive information about a data point. It differs from the TrackballBehavior in terms of visual information and trigger action.

    • SelectionBehavior

      This behavior handles the Tap event to enable selection/deselection of data points and/or chart series. When a data point becomes "Selected", the Chart's SelectionPalette property is used to visualize the selected point.