Blog

In version 2.1 of Visiblox Charts, we have added support for Microsoft Expression Blend. The premium version is shipped along with a design library, the Visiblox.Charts.Design.dll, which holds some extra information when building charts with Expression Blend.

Overview

Support for Blend includes the following:

• Grouping Visiblox Charts properties in different attribute panels depending on their functionality.
• Customizing the display of specific properties to provide a more user friendly interface. For example, when the chart is selected and the Series property is exposed, you can easily select a series type to add to the chart.
• Adding the Visiblox Charts components into the asset library.
• Providing default initializers for all the chart types.

One of the new features introduced in version 2.1 of Visiblox Charts is the DiscontinuousLineSeries. In the previous versions, in order to render gaps in your line or change the styling for one particular region, you had to use multiple LineSeries or implement your own series. This blog post will demonstrate how to use the DiscontinuousLineSeries to easily and - most importantly - with minimum code get the desired results.

• How it works
• Examples
  • Simple style change
  • Hide points and areas across the discontinuity
  • Show diamond shaped points only across the discontinuity
  • Add special points on top of the base line
• Combined Application
• Summary

How it works

The DiscontinuousLineSeries is based on the LineSeries which means that it inherits all the LineSeries styles and dependency properties. Also, just like every other series type, it gets its data from the DataSeries property. The difference is that you can add null DataPoints, which will affect the next DataPoint in the DataSeries. For example, if we added 3 DataPoints: (1,1), (2,2), (3,3) and we wanted point (2,2) to have a different style or introduce a gap in the line, we would have to add 4 DataPoints in the following order: (1,1), null, (2,2), (3,3).

The Visiblox team is delighted to announce the availability of Visiblox Charts v2.1!

New Features

Lots of new features have been added to the charts since 2.0, including:

• Discontinuous line series - This new series type allows the plotting of lines with gaps or alternately styled segments. There are some examples of these in our examples gallery: Discontinous Line Example and Projection Example.

• Data labels - A number of chart series (line, bar, column and band series) now support data labels. These are labels placed next to the data points showing the value for that point. This is demonstrated by the example found here.

• Reverse Axes - All axis types now support reversing, which allows them to be plotted in the reverse direction with the larger values at the bottom or left and the smaller values at the top or right for Y and X respectively. See this in action in our reversed axis example.

• Theme support and styling changes - We’ve introduced themes in Visiblox Charts 2.1 which with the simple switch of a resource file restyle the visuals of the chart. To support themes the styling code in Visiblox Charts has been reviewed and improved. In addition some pre-defined themes are included in the premium distribution which can be used as is or modified to suit. The previously mentioned example shows off the packaged themes.

• Expression Blend support - To complement the new styling improvements, the premium edition of Visiblox Charts 2.1 now comes with design time support for Expression Blend.

• Improved MVVM support - One of the missing jigsaw pieces to our MVVM support was to make the BindableDataSeries' ItemSource property bindable. This has now been implemented, making the use of Visiblox Charts in an MVVM context even easier.

• New per-point styling on bar and column series - When you're only plotting one column or bar series on the chart, it can be desirable to have each bar or column rendered in a different colour. In previous versions of Visiblox Charts this wouldn't have been easily possible, but we've now introduced a per-point styling mode on bar and column series to support this. The Series will render each bar or column in a different colour, based on the Chart's palette.

There is a free version of Visiblox Charts 2.1 available for download now, so why not give it a spin?

We are often asked if there is a built-in way to save a Visiblox Chart as an image file. Unfortunately, at the time of writing, the answer to this is no. However, it doesn't take too much code to make it possible and this blog post is going to describe the steps involved.

WPF vs Silverlight

This post focuses on the Silverlight solution, which is more complex and requires the use of third party classes. The source code for this post, which can be downloaded here, contains both Silverlight and WPF solutions to saving a chart as an image. If you look at this source, you will see that the WPF solution is a lot simpler, with all the functionality in one place and no external classes required.

Chart Interaction

There are a number of ways to enable the save functionality on a chart; the most common being a Save As Image context menu. Using this approach required the use of the premium version of Visiblox Charts which allows us to disable the default context menu behaviour.

A previous blog post has covered the topic of FilteredDataSeries - in short, they're a way of dynamically filtering out the DataPoints plotted by a series. The policy used to determine which points are excluded is implemented in an IFilterStrategy and the FilteredDataSeries holds a reference to an instance of that implementation.

Visiblox already comes with one implementation, WindowedFilterStrategy, another one can be downloaded from the blog post mentioned above and, of course, you can implement your own strategies. But suppose the strategy you want is essentially a combination of pre-existing strategies? This post shows how you can chain two filters together.