Telerik Forums
UI for WPF Forum
4 answers
601 views

Hi, I am currently working over the chart control which should fulfill the following requirements:

  • represent live linear charts (like a processor load chart)
  • provide multiple y-axis (to represent charts of boolean, integer and double variables on the same x-axis)
  • provide panning by x-axis ability

I checked if your RadChartView control was able to deal with this task and fell in trouble with several issues. I hope that reasons for such a behavior come from my lack of understanding how charting should be implemented, so we will be able to rely on your control if only we would have those issues fixed. Instead of attaching the whole project, I will try to provide enough information for you in the code snippets.

I need to show from 1 to 10 parameters of different types.

When each parameter is updated i add new value in the corresponding array this way: 


ParameterInfo._log.Add(val, DateTime.Now);


public class ParameterRecord
{
  private object _value;
  private DateTime _date;
}
  
public class ParameterInfo : ViewModelBase
{
  private ObservableCollection<ParameterRecord> _log;
  private string _type;
}

The first problem is

'How can I provide simple x-axis panning capabilities for the live chart?'

I have a timer which updates the chart each 500 milliseconds. It basically fixes the Maximum and Minimum properties of the x-axis:

chart.HorizontalAxis.Minimum = now.Subtract(_horizontalScaleLength);
chart.HorizontalAxis.Maximum = now;

In this way the auto-pan to the last moment works alright but there's no possibility to pan the chart. 

It's obvious that if I want to provide the panning to the very initial moment when the chart was shown, I shall leave 


chart.HorizontalAxis.Minimum == initialDateTime;

I see two possibilities to fix this issue:

  1. Use the external scrollbar and bind it to HorizontalAxis.Minimum and HorizontalAxis.Minimum properties. Activate user-driven panning when the scrollbar changes its value, switch back to auto-panning when, for example, user sets the maximum value on the scrollbar. Unfortunately this won't look good enough if I will use the external scrollbar. Is it possible to customize the behavior of the internal scrollbar to satisfy our needs?
  2. Every time the chart should be updated (500 milliseconds in my case) leave all the parameters unchanged except the zoom scale. Theoretically it's possible to calculate the appropriate zoom value so the absolute size of the visible segment on the x-scale would be constant. However I couldn't find available property via which I could change the zoom scale dynamically from the code behind. Is there any possibility?


The second problem is

'How much points should i add to the data source? How much points is it able to carry?'


At first I tried to add the values every time the timer event is figured (i.e. each 500 milliseconds) However it turned out to be a bad idea. The chart started to go slower and almost stopped with the time. It had about 5000 data points just for 1 minute. I suppose that either there shouldn't be very much points in the data source or I should dynamically filter only the visible segment of a big array. Do you see the latter way convenient enough?

So I turned to the other option, I added new data points to the appropriate series only when their values change. Unsurprisingly, the result looked like a saw (attached file telerik letter - zig-zag trackball.gif)

So I had to add two values when the new value arrives and move the second one further to prolongate the horizontal segment until the next change:

if (oldValue != newValue)
{
  lg.Add(new ParameterRecord(newValue, DateTime.Now)); // the point that will remain
  lg.Add(new ParameterRecord(newValue, DateTime.Now)); // the point that will be prolongated
}
else
{
  lg.RemoveAt(lg.Count - 1);
  lg.Add(new ParameterRecord(oldValue, DateTime.Now));   // prolongate the horizontal line
}

I want you to know if this is a convenient way because it leads to the problem with the TrackBallInfo. Because there are no data points, in between the moments of the value change, the TrackBallInfo snaps to the closest data point instead of displaying the actual value under the mouse pointer. This is not desired (look at the attachment telerik letter - trackball glitch.gif) 

I also have troubles with the dynamical setting of the bunch of y-axes in the code behind, but I didn't try enough by myself yet because it's crucial to know if Telerik's solution is able to deal with just the issues described here.

Thank you,

Andrey

Ryan
Top achievements
Rank 1
 answered on 07 Aug 2012
3 answers
180 views
Hi,

Is there a way to disable the ScheduleView's scrollbars and just move it inside a ScrollViewer?

Thanks,
Mark
Miroslav Nedyalkov
Telerik team
 answered on 07 Aug 2012
8 answers
385 views
Hello, I'm binding the radGridView to an observablecollection of objects which contain 3 properties. So the grid is displayed with 3 columns. 1 of the columns is an observablecollection which I'm trying to bind a GridViewComboBoxColumn to, but the dropdown will only display when I click in the cell and then disappears when I leave. Any help would be greatly appreciated.

Thanks
Scott

<telerik:RadGridView x:Name="radGrid" Margin="5,5,5,5" ItemsSource="{Binding PersonViews}" RowIndicatorVisibility="Collapsed" AutoGenerateColumns="False" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" FontSize="14">

<telerik:RadGridView.Columns>

<telerik:GridViewDataColumn DataMemberBinding="{Binding Name}" Header="Name" />

<telerik:GridViewDataColumn DataMemberBinding="{Binding Location}" Header="Location"/>

<telerik:GridViewComboBoxColumn ItemsSourceBinding="{Binding Occupation}"

UniqueName="Uniq"

SelectedValueMemberPath="ID"

DisplayMemberPath="Occupation" Header="Occupation"/>

</telerik:RadGridView.Columns>

</telerik:RadGridView>

 

 

using

 

 

System;

 

using

 

 

System.Collections.Generic;

 

using

 

 

System.Linq;

 

using

 

 

System.Text;

 

using

 

 

System.ComponentModel;

 

using

 

 

System.Collections.ObjectModel;

 

namespace

 

 

GridComboBindingTest

 

{

 

 

class GridViewModel : INotifyPropertyChanged

 

{

 

 

private ObservableCollection<PersonView> _personViews;

 

 

 

 

public GridViewModel()

 

{

PersonViews =

 

new ObservableCollection<PersonView>();

 

 

 

PersonView gridView = new PersonView();

 

gridView.Location =

 

"Chicago";

 

gridView.Name =

 

"Fred";

 

 

 

 

PersonOccupation tc = new PersonOccupation();

 

tc.ID = 1;

tc.Occupation =

 

"Programmer";

 

gridView.Occupation =

 

new ObservableCollection<PersonOccupation>();

 

gridView.Occupation.Add(tc);

tc =

 

new PersonOccupation();

 

tc.ID = 2;

tc.Occupation =

 

"Sales";

 

gridView.Occupation.Add(tc);

tc =

 

new PersonOccupation();

 

tc.ID = 3;

tc.Occupation =

 

"Tech";

 

gridView.Occupation.Add(tc);

PersonViews.Add(gridView);

 

 

 

gridView =

 

new PersonView();

 

gridView.Location =

 

"NY";

 

gridView.Name =

 

"Joe";

 

tc =

 

new PersonOccupation();

 

tc.ID = 1;

tc.Occupation =

 

"Cook";

 

gridView.Occupation =

 

new ObservableCollection<PersonOccupation>();

 

gridView.Occupation.Add(tc);

tc =

 

new PersonOccupation();

 

tc.ID = 2;

tc.Occupation =

 

"Chef";

 

gridView.Occupation.Add(tc);

tc =

 

new PersonOccupation();

 

tc.ID = 3;

tc.Occupation =

 

"Tech";

 

gridView.Occupation.Add(tc);

PersonViews.Add(gridView);

 

 

 

gridView =

 

new PersonView();

 

gridView.Location =

 

"LA";

 

gridView.Name =

 

"Sam";

 

tc =

 

new PersonOccupation();

 

tc.ID = 1;

tc.Occupation =

 

"Tech";

 

gridView.Occupation =

 

new ObservableCollection<PersonOccupation>();

 

gridView.Occupation.Add(tc);

tc =

 

new PersonOccupation();

 

tc.ID = 2;

tc.Occupation =

 

"Student";

 

gridView.Occupation.Add(tc);

tc =

 

new PersonOccupation();

 

tc.ID = 3;

tc.Occupation =

 

"Writer";

 

gridView.Occupation.Add(tc);

PersonViews.Add(gridView);

}

 

 

 

public ObservableCollection<PersonView> PersonViews

 

{

 

 

get { return _personViews; }

 

 

 

set

 

{

 

 

if (_personViews != value)

 

{

_personViews =

 

value;

 

RaisePropertyChanged(

 

"GridViews");

 

}

}

}

 

 

 

public event PropertyChangedEventHandler PropertyChanged;

 

 

 

private void RaisePropertyChanged(string propertyName)

 

{

 

 

// take a copy to prevent thread issues

 

 

 

PropertyChangedEventHandler handler = PropertyChanged;

 

 

 

if (handler != null)

 

{

handler(

 

this, new PropertyChangedEventArgs(propertyName));

 

}

}

}

 

 

 

public class PersonView : INotifyPropertyChanged

 

{

 

 

private ObservableCollection<PersonOccupation> _occupation;

 

 

 

public string Name

 

{

 

 

get;

 

 

 

set;

 

}

 

 

public string Location

 

{

 

 

get;

 

 

 

set;

 

}

 

 

 

public ObservableCollection<PersonOccupation> Occupation

 

{

 

 

get { return _occupation; }

 

 

 

set

 

{

 

 

if (_occupation != value)

 

{

_occupation =

 

value;

 

RaisePropertyChanged(

 

"Person");

 

}

}

}

 

 

public event PropertyChangedEventHandler PropertyChanged;

 

 

 

private void RaisePropertyChanged(string propertyName)

 

{

 

 

// take a copy to prevent thread issues

 

 

 

PropertyChangedEventHandler handler = PropertyChanged;

 

 

 

if (handler != null)

 

{

handler(

 

this, new PropertyChangedEventArgs(propertyName));

 

}

}

}

 

 

public class PersonOccupation : INotifyPropertyChanged

 

{

 

 

private string _occupation;

 

 

 

private int _ID;

 

 

 

public string Occupation

 

{

 

 

get { return _occupation; }

 

 

 

set

 

{

 

 

if (_occupation != value)

 

{

_occupation =

 

value;

 

RaisePropertyChanged(

 

"Occupation");

 

}

}

}

 

 

public int ID

 

{

 

 

get { return _ID; }

 

 

 

set

 

{

 

 

if (_ID != value)

 

{

_ID =

 

value;

 

RaisePropertyChanged(

 

"ID");

 

}

}

}

 

 

public event PropertyChangedEventHandler PropertyChanged;

 

 

 

private void RaisePropertyChanged(string propertyName)

 

{

 

 

// take a copy to prevent thread issues

 

 

 

PropertyChangedEventHandler handler = PropertyChanged;

 

 

 

if (handler != null)

 

{

handler(

 

this, new PropertyChangedEventArgs(propertyName));

 

}

}

}

}

Scott Michetti
Top achievements
Rank 1
Iron
 answered on 07 Aug 2012
1 answer
198 views
Hi,

Can we create our own controls like Rectangle, Ellipse and add them to the Rad Diagram for performing all the functionality which are supported by Rad Diagram?

Please send us example. I need to add Rectangle to the Rad Diagram and need to change its color, size... How to do that???

To dynamically get control I used below code:
RadDiagramShape shape=new RadDiagramShape();
            shape.Geometry= ShapeFactory.GetShapeGeometry(CommonShapeType.RectangleShape);
            raddiag.AddShape(shape);

foreach
 (RadDiagramShape sample in raddiag.Items)
                {
                sample.Background  = newBrush;
                }


And used the foreach loop to get the control and apply color... but  we are not able to get any item in raddiag.Items it is showing null.. what we are missing here???? please let us know...

Keenly waiting for reply...

Regards,
Swati 
Tina Stancheva
Telerik team
 answered on 07 Aug 2012
2 answers
156 views
Hi All,

I am currently using Q2 2011 Rad controls..and Rad Diagram is not included in this install....How can I use Rad Diagram Control in Q2 2011?

Also can I get any working  example of the same?

Please reply as early as possible..

Regards,
Swati
Tina Stancheva
Telerik team
 answered on 07 Aug 2012
1 answer
133 views
Hi,

I'm using the RibbonView version 2012.1.326.  I would like to to be able to display the contents of each tab as a user hovers over the title area of each tab when the Ribbon is minimized.  I would like the Ribbon to return to the minimized state when the user moves the mouse off of the tab. Are there any hover or mouseover events for the tab that I could subscribe to inorder to accomplish this?

Thanks,
Trang 
Tina Stancheva
Telerik team
 answered on 07 Aug 2012
1 answer
87 views
Hello,

I have a user control which implments INotifyPropertyChanged, and has a radTimeBar declared in xaml.  I set the datacontext in codebehind to "this".  However, the Property changed never gets set, so I can't update the time bar properties.  Any Idea why this might be?  Here is a code sample:
Thanks,
Eric
public partial class PerfPresenter : INotifyPropertyChanged
    {
         public static readonly DependencyProperty VisiblePeriodStartProperty =
            DependencyProperty.Register("VisiblePeriodStart", typeof(DateTime), typeof(PerfPresenter));
 
        public static readonly DependencyProperty VisiblePeriodEndProperty =
            DependencyProperty.Register("VisiblePeriodEnd", typeof(DateTime), typeof(PerfPresenter));
        public DateTime VisiblePeriodStart
        {
            get { return (DateTime)GetValue(VisiblePeriodStartProperty); }
            set
            {
                SetValue(VisiblePeriodStartProperty, value);
                NotifyPropertyChanged(VisiblePeriodStartProperty.Name);
            }
        }
 
        public DateTime VisiblePeriodEnd
        {
            get { return (DateTime)GetValue(VisiblePeriodEndProperty); }
            set
            {
                SetValue(VisiblePeriodEndProperty, value);
                NotifyPropertyChanged(VisiblePeriodEndProperty.Name);
            }
        }
        public PerfPresenter()
        {
            this.DataContext = this;
            InitializeComponent();
        }
 
public event PropertyChangedEventHandler PropertyChanged;
 
        private void NotifyPropertyChanged(String info)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(info));
            }
        }
}

<UserControl x:Class="Microsoft.Office.Engineering.PerfPresenter"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:Microsoft.Office.Engineering"
             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation" mc:Ignorable="d"
             d:DesignHeight="300" d:DesignWidth="300">
        <Grid x:Name="PerfGrid" DataContext="{Binding}">
<
telerik:RadTimeBar x:Name="radTimeBar" DataContext="{Binding}"
                             
                            Grid.Column="1" Background="Transparent"
                            ItemIntervalChanged="RadTimeBar_ItemIntervalChanged"
                            PeriodStart="{Binding PeriodStart, Mode=OneWay}" PeriodEnd="{Binding PeriodEnd, Mode=OneWay}"
                            VisiblePeriodStart="{Binding VisiblePeriodStart, Mode=TwoWay}" VisiblePeriodEnd="{Binding VisiblePeriodEnd,Mode=TwoWay}"
                            Selection="{Binding TimeSelection, Mode=OneWayToSource}" MinSelectionRange="{Binding MinimumSelectionRange, Mode=OneWay}" SelectionChanged="TimeBarSelectionChanged"
                            MinZoomRange="{Binding ActualMinZoomRange, Mode=OneWayToSource}"
                            MouseDoubleClick="RadTimeBarMouseDoubleClick"
                            VisiblePeriodChanged="RadTimeBarVisiblePeriodChanged">
            <telerik:RadTimeBar.Margin>
                <Thickness Left="0"
                           Right="{x:Static SystemParameters.VerticalScrollBarWidth}"
                           Top="0"
                           Bottom="0"/>
            </telerik:RadTimeBar.Margin>
            <telerik:RadTimeBar.Intervals>
                <telerik:MinuteInterval IntervalSpans="1, 5, 10, 15" />
            </telerik:RadTimeBar.Intervals>
            <Grid x:Name="radTimeBarGrid">
            </Grid>
        </telerik:RadTimeBar>
</Grid>
</UserControl>
Tsvetie
Telerik team
 answered on 07 Aug 2012
1 answer
381 views
Hello,

In keeping with the mvvm style, I have been trying populate the timebar intervals via binding.  However, it complains at me when I try(see below) because Intervals is readonly.  I noticed the interval groups and interval items properties, but I'm not sure what they do.  Is there a way to populate the intervals (and acess other read-only properties such as ActualMinZoomRange) without resorting to giving the RadTimeBar and "x:Name="?

Thanks,
Eric
<telerik:RadTimeBar DataContext="{Binding}" Intervals="{Binding Intervals, Mode=OneWayToSource}"/>
Tsvetie
Telerik team
 answered on 07 Aug 2012
6 answers
121 views
I evaluated the WPF gauge controls a few version ago, and the controls in the demo were very different (nicer, I think). They were so nice that I used a screen shot to capture them and bring it directly into my photoshop design. I've finally completed the design phase and am ready to bring the code back in, but I can't seem to find the source code example to make the gauge look like what I saw in the demo.

Am I looking in the wrong place? Have the controls changed so drastically that I can't use the old design? I've attached an image of the control I borrowed from an earlier telerik demo...

Any chance this sample code is still laying around you can share?
Sia
Telerik team
 answered on 07 Aug 2012
1 answer
122 views
I am having trouble setting up grouping by a column that is bound to a data element that goes through a value converter.  Below I am trying to group by the Reading Station Column.

<tk:RadGridView Name="RoutesGrid"
            AutoGenerateColumns="False" IsSynchronizedWithCurrentItem="True"
            ItemsSource="{Binding PagedSource, ElementName=DataPager}" SelectedItem="{Binding SelectedRoute}"
                        tk:StyleManager.Theme="Summer" MouseRightButtonDown="RadGridView_MouseRightButtonDown">
            <!--<tk:RadGridView.GroupDescriptors>
                <tk:ColumnGroupDescriptor Column="{Binding Columns[\Reading Station\], ElementName=RoutesGrid}" />
            </tk:RadGridView.GroupDescriptors>-->
            <tk:RadGridView.Columns>
                <tk:GridViewDataColumn
					Header="ID"
					DataMemberBinding="{Binding ID}"
					TextAlignment="Center">
                </tk:GridViewDataColumn>
                <tk:GridViewDataColumn 
					Header="Reading Station"
					DataMemberBinding="{Binding ReadingWorkstation, Converter={StaticResource WorkstationToNameConverter}}"
					TextAlignment="Center" Width="Auto">
Vera
Telerik team
 answered on 07 Aug 2012
Narrow your results
Selected tags
Tags
GridView
General Discussions
Chart
RichTextBox
Docking
ScheduleView
ChartView
TreeView
Diagram
Map
ComboBox
TreeListView
Window
RibbonView and RibbonWindow
PropertyGrid
DragAndDrop
TabControl
TileView
Carousel
DataForm
PDFViewer
MaskedInput (Numeric, DateTime, Text, Currency)
AutoCompleteBox
DatePicker
Buttons
ListBox
GanttView
PivotGrid
Spreadsheet
Gauges
NumericUpDown
PanelBar
DateTimePicker
DataFilter
Menu
ContextMenu
TimeLine
Calendar
Installer and Visual Studio Extensions
ImageEditor
BusyIndicator
Expander
Slider
TileList
PersistenceFramework
DataPager
Styling
TimeBar
OutlookBar
TransitionControl
FileDialogs
Book
ToolBar
ColorPicker
TimePicker
MultiColumnComboBox
SyntaxEditor
VirtualGrid
Wizard
ExpressionEditor
NavigationView (Hamburger Menu)
WatermarkTextBox
DesktopAlert
BarCode
SpellChecker
DataServiceDataSource
EntityFrameworkDataSource
RadialMenu
ChartView3D
Data Virtualization
BreadCrumb
LayoutControl
ProgressBar
Sparkline
TabbedWindow
ToolTip
CloudUpload
ColorEditor
TreeMap and PivotMap
EntityFrameworkCoreDataSource (.Net Core)
HeatMap
Chat (Conversational UI)
VirtualizingWrapPanel
Calculator
NotifyIcon
TaskBoard
TimeSpanPicker
BulletGraph
Licensing
WebCam
CardView
DataBar
FilePathPicker
PasswordBox
SplashScreen
Callout
Rating
Accessibility
CollectionNavigator
Localization
AutoSuggestBox
Security
VirtualKeyboard
HighlightTextBlock
TouchManager
StepProgressBar
Badge
OfficeNavigationBar
ExpressionParser
CircularProgressBar
SvgImage
PipsPager
SlideView
AI Coding Assistant
+? more
Top users last month
Cynthia
Top achievements
Rank 1
Iron
Toby
Top achievements
Rank 3
Iron
Iron
Iron
Danielle
Top achievements
Rank 1
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Iron
yw
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Cynthia
Top achievements
Rank 1
Iron
Toby
Top achievements
Rank 3
Iron
Iron
Iron
Danielle
Top achievements
Rank 1
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Iron
yw
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?