Skip to main content


Creating a Numeric Navigator with an Ajax Chart Slider

As part of a FAST search proof of concept, I got the opportunity recently to create slightly more advanced navigator than the typical text-based set of hyperlinks. I used the FAST ESP WebParts (available on CodePlex) as a starting point and the Dundas Chart control as the basis for the Ajax user interface. Getting the data from FAST into the chart was surprisingly easy.
Here’s what it ended up looking like:
Here’s what was involved:
FAST configuration:
You’ll need to update your index profile if it doesn’t already contain what you need. In my case, I have a field called “pubyear” that I’ve added that gets an integer placed in it during document processing:

<field name="pubyear" type="int32"/>

And here’s the numeric navigator for that field:

<numeric-navigator name="pubyearnavigator" display="Publication Year" unit="year" algorithm="equalwidth" resolution="1"><field-ref name="pubyear"/></numeric-navigator>

WebPart stuff:

  • Create a webpart class and derive from ESPSearchWebPart – this gets you wired up to search context, etc.
  • Provide overrides for ConfigureSearch and the other ESPSearchWebPart stuff as necessary. You can basically just steal the implementation from one of the “out-of-the-box” navigators and change what you need to.
  • Override CreateChildControls and load the usercontrol that will do the interesting parts.

ASP.NET and other stuff:

  • Create a usercontrol
  • In the Page_Load event, go get the relevant IESPNavigator from search context. This is where having the FAST ESP WebParts comes in handy:
foreach (IESPNavigator espNavigator inthis.SearchResult.Navigators) { if (espNavigator.Name =="pubyearnavigator") { Dictionary<string, int> years = getYears(espNavigator.NavigatorItems.GetEnumerator()); Chart1.Series["Series1"].Points.DataBindXY(years.Keys, years.Values); Chart1.ChartAreas["Default"].CursorX.UserEnabled =true; Chart1.AxisViewChanged +=new ViewEventHandler(Chart1_AxisViewChanged); } }

A couple of helper methods to convert the data that FAST returns to something that the chart can easily consume:

private Dictionary<string, int> getYears(IEnumerator<IESPNavigatorItem> navigatorItems) { Dictionary<string, int> years =new Dictionary<string, int>(); while (navigatorItems.MoveNext()) { IESPNavigatorItem navigatorItem = (IESPNavigatorItem)navigatorItems.Current; years.Add(parseDate(navigatorItem.FilterValue), navigatorItem.ResultCount); } return years; } privatestring parseDate(string modifierValue) { //Looks like 3 different variants -- the first value, all the inner values, and then the last value... //[;2008-04-01T00:00:00Z] //[2008-04-02T00:00:00Z;2008-04-02T00:00:00Z] //[2009-12-01T00:00:00Z;] //get rid of [ and ] brackets //take the second value after the ; (unless there is no second, then take the first) //drop the time (T and everything after it)string[] dates = modifierValue.Trim(newchar[] { '[', ']' }).Split(';'); return dates[string.IsNullOrEmpty(dates[1]) ?0 : 1].Split('T')[0]; }

The whole thing really didn’t end up being much work. The ESP WebParts take care of all of the details of the query server semantics, and the Chart control took care of most of the UI. There were a few details to be worked out in the UI obviously. I also had to tweak some of the code in the SearchRequest, ESPSearchManager and FQLQueryBuilder objects in order to support the slightly more complicated data that has to flow back up to the query server to support “ranges” in the navigator rather than a single value.
Here are the links to the items I used:
FAST ESP WebParts for SharePoint 2007
Dundas Chart for .NET

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Michael Becker

More from this Author

Follow Us