Jump to content
Software FX Community

Help in adding a border around the chart plot area


Recommended Posts


I'm new to chartfx and i need help on how to add a border around the chart plot area.

The API reference mentions that I can set a Datatemplate to Chart.PlotArea.FrameTemplate but i'm kind of stuck on gow to define a template that encolses the chat PlotArea.

Can anyone help me in the regard..

Many Thanks





Link to comment
Share on other sites

Most of our styles (including the default) draw a border around the plot area. You might want to try switching styles

chart1.Style = ChartFX.WPF.Motifs.Simple.Style;

Instead of Simple you could also use Basic, Edge or Spotlight.

You can also change the palette in case the color used of the plot area border is not strong enough.

chart1.Palette = ChartFX.WPF.Palettes.Adventure;

Other palettes in the same namespace include Mesa, Primary and others. Finally you can control the plot area border color manually

chart1.PlotArea.Stroke = System.Windows.Media.Brushes.Red;



Link to comment
Share on other sites

  • 4 weeks later...

The following xaml will use the basic chart style and customize the plot area frame template with a curved border.

<cfx:Chart Gallery="Bar" x:Name="chart1" Style="{x:Static cfxMotifs:Basic.Style}" > <cfx:Chart.PlotArea> <cfx:PlotAreaAttributes> <cfx:PlotAreaAttributes.FrameTemplate>   <DataTemplate>   <Border CornerRadius="8" Width="{Binding Path=Width}" Height="{Binding Path=Height}" Background="{Binding Path=Fill}" BorderBrush="{Binding Path=Stroke}" BorderThickness="{Binding Path=StrokeThickness}" />   </DataTemplate>   </cfx:PlotAreaAttributes.FrameTemplate>   </cfx:PlotAreaAttributes</cfx:Chart.PlotArea>

Note that to use the cfxMotif you would need the following namespace declaration at the root of your xaml




Link to comment
Share on other sites

  • 1 month later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...