nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Graphs and Charts

NathalieNeagle

I have a simple police application that allows officers to spatial select and query some points (police calls). I using esri FeatureDataGrid. I wanted to create a few simple charts and graphs and send the queried data (that is in the featuredatagrid) into these grids and charts.

Currently I'm trying to send the selected GraphicLayer
<esri:GraphicsLayer ID="MySelectionGraphicsLayer" />

here's a small snip of my code behind to select the graphiclayer

 GraphicsLayer selectionGraphicslayer = Map.Layers["MySelectionGraphicsLayer"] as GraphicsLayer;
            selectionGraphicslayer.ClearGraphics();

I'm wondering if I'm binding it right

Here's my Pie Chart

 <Grid Style="{StaticResource WrapperStyle}">
            <chartingToolkit:Chart Title="AnimationSequence = FirstToLast" Palette="{StaticResource GrowPieDataPointPalette}" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown" Margin="1,4,-1,-4">
                <chartingToolkit:Chart.Series>
                    <chartingToolkit:PieSeries ItemsSource="{Binding ElementName=Map, Path=Layers[MySelectionGraphicsLayer].Graphics}" DependentValueBinding="{Binding Attributes[DISPDESC]}" AnimationSequence="FirstToLast"/>
                 </chartingToolkit:Chart.Series>
            </chartingToolkit:Chart>
        </Grid>

My table works and here's how I'm binding that:

 <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="15" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>
                            <TextBlock x:Name="DataDisplayTitle" Text="Search Results" FontSize="9" Grid.Row="0" FontWeight="Bold" FontFamily="Arial" Foreground="#FFFFFFFF" />



                            <esriWidgets:FeatureDataGrid Grid.Row="1" x:Name="QueryDetailsDataGrid" Height="170" 
                                      Map="{Binding ElementName=Map}" 
                                      GraphicsLayer="{Binding Layers[MySelectionGraphicsLayer], ElementName=Map}" />

                        </Grid>

Does it seem like I'm binding the Pie Graph correctly because now app is not completely firing and its not really working; it is only selecting or creating one graphic. If I try to select 20 points only one gets selected and the featuredatagrid is not firing and showing up (ResultsDisplay.Visibility = Visibility.Visibility). Everything was working before so I'm wondering/thinking it is something with my pie chart.

Thanks
Nat

Find more posts tagged with

Accepted answers

All comments

DominiqueBroux

:)Thank you very very much for both Nathalie and Dominique. It's great topic.
And i was wondered if i can show the chart at the same place of the selected polygon .

If you need one chart by polygon we might look at that sample that may be closer of your need.

Here we display only one chart showing all graphics or group of graphics in the same chart.
I am not sure it makes sense that this chart overrides the selected graphics.
But anyway it could be done by setting the position of the chart by code instead of using a fixed position (to do each time the selection changes).

Another, if you can explain this object:

DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["NAME"],
(subregion, graphics) => new AttributeGroup
{
Key = subregion,
Count = graphics.Count(),
Sum = graphics.Select(g => (int)g.Attributes["ELEVATION"]).Sum(),
Graphics = graphics
}).ToArray();

NAME being an unique identifier, a group by NAME is not the best sample since it's just returning the complete list of graphics.

The initial sample was:

// Group by sub region
            Groups1  = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["SUB_REGION"],
                            (key, graphics) => new AttributeGroup
                            {
                                Key      = key,
                                Count    = graphics.Count(),
                                Sum      = graphics.Select(g => (int)g.Attributes["POP2000"]).Sum(),
                                Graphics = graphics
                            }).ToArray();

Here we group the graphics by SUB_REGION (by using the keySelector : (string)graphic.Attributes["SUB_REGION"])
and for each SUB_REGION we return an AttributeGroup containing mainly the SubRegion (Key) and the population of the subregion (Sum).
This list of AttributGroup is used as ItemsSource for the chart with the SubRegion as independent value and the population as dependent value. So we get a chart showing the population by subregion.

Hope this helps.

AbdulrahmanTaher

:)Thank you very very much for both Nathalie and Dominique. It's great topic.
And i was wondered if i can show the chart at the same place of the selected polygon .

Another, if you can explain this object:

DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["NAME"],
                            (subregion, graphics) => new AttributeGroup
                            {
                                Key = subregion,
                                Count = graphics.Count(),
                                Sum = graphics.Select(g => (int)g.Attributes["ELEVATION"]).Sum(),
                                Graphics = graphics
                            }).ToArray();

NathalieNeagle

Hello,

I would like to use this code but I don't know how to display in another datagrid all the information of MySelectionGraphicsLayer when I select.

Could you help me please ?

Thank you very much,
Fabien (fr)

Fabien,
I just noticed you posted and wanted the code are you still in need of help?

Nathalie

FabienNAPPA

Hello,

I would like to use this code but I don't know how to display in another datagrid all the information of MySelectionGraphicsLayer when I select.

Could you help me please ?

Thank you very much,
Fabien (fr)

NathalieNeagle

Dominique,

Thank You! The conference and Beer are right around the corner...see you there!

Nathalie

DominiqueBroux

Hi Nathalie,

As it's easier with a sample than explaining, I updated the sample to display 2 charts, one pie chart with the population 2007 grouped by region and one column serie with the population 2007 grouped by the first letter of the state name.

The steps are these:
1) create 2 DP (one by chart) of type IEnumerable<AttributeGroup> in the user control

 
        public IEnumerable<AttributeGroup> Groups1
        {
            get { return (IEnumerable<AttributeGroup>)GetValue(Groups1Property); }
            set { SetValue(Groups1Property, value); }
        }
        // Using a DependencyProperty as the backing store for Groups1.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty Groups1Property =
            DependencyProperty.Register("Groups1", typeof(IEnumerable<AttributeGroup>), typeof(SpatialQuery), null);
        public IEnumerable<AttributeGroup> Groups2
        {
            get { return (IEnumerable<AttributeGroup>)GetValue(Groups2Property); }
            set { SetValue(Groups2Property, value); }
        }
        // Using a DependencyProperty as the backing store for Groups2.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty Groups2Property =
            DependencyProperty.Register("Groups2", typeof(IEnumerable<AttributeGroup>), typeof(SpatialQuery), null);

2) Initialize these DP when the graphics are known:

             // Group by sub region
            Groups1  = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["SUB_REGION"],
                            (key, graphics) => new AttributeGroup
                            {
                                Key      = key,
                                Count    = graphics.Count(),
                                Sum      = graphics.Select(g => (int)g.Attributes["POP2000"]).Sum(),
                                Graphics = graphics
                            }).ToArray();
            // Group by first letter of the state name
            Groups2 = graphicsLayer.Graphics.GroupBy(graphic => ((string)graphic.Attributes["STATE_NAME"]).FirstOrDefault().ToString(),
                            (key, graphics) => new AttributeGroup
                            {
                                Key = key,
                                Count = graphics.Count(),
                                Sum = graphics.Select(g => (int)g.Attributes["POP2007"]).Sum(),
                                Graphics = graphics
                            }).OrderBy(group => group.Key).ToArray();

3) Give a name to the user control
<UserControl x:Name="MyUserControl"

4) Bind the ItemsSource of the charts to the DPs of that user control

< <StackPanel x:Name="ChartDisplay" Visibility="Collapsed"> <Grid Width="400" Height="300" HorizontalAlignment="Left" VerticalAlignment="Top" > <chartingToolkit:Chart Title="Population 2000 by Region" BorderBrush="Transparent"> <chartingToolkit:PieSeries IsSelectionEnabled="True" SelectionChanged="ChartSeries_SelectionChanged" ItemsSource="{Binding Groups1, ElementName=MyUserControl}" IndependentValuePath="Key" DependentValuePath="Sum" AnimationSequence="FirstToLast"/> </chartingToolkit:Chart> </Grid> <Grid Width="400" Height="300" HorizontalAlignment="Left" VerticalAlignment="Top"> <chartingToolkit:Chart Title="Population 2007" BorderBrush="Transparent"> <chartingToolkit:ColumnSeries Title="State First Letter" IsSelectionEnabled="True" SelectionChanged="ChartSeries_SelectionChanged" ItemsSource="{Binding Groups2, ElementName=MyUserControl}" IndependentValuePath="Key" DependentValuePath="Sum" AnimationSequence="FirstToLast"/> </chartingToolkit:Chart> </Grid> </StackPanel>
I attached the code and the result to this post.

Looking forward to drinking that beer:)

PieChart2.jpg

SpatialQuery.zip

NathalieNeagle

Dominique,

Thanks so much for tending to all my needs; I really owe you...UC 2011 Beers;)

So I'm having a little trouble with everything it seems. As far as the two new dependency properties
dbroux;97173 wrote:
In your control (or your view model), you have to create two dependency properties (or 2 properties) of type IEnumerable<AttributeGroup>.
QUOTE]

Not really sure if this is correct but after reading the Dependency Properties Overview
on the msdn over and over again this is what I came up with...Sorry I'm learning and hacking my way through

  public class AttributeGroup
        {
            public static DependencyProperty PieGraphListProperty = DependencyProperty.Register(
                "PieGraphList", 
                typeof(IEnumerable<object>),
                typeof(AttributeGroup),
                 null); 
        
            public class PieGraphList
            {
                public string Key { get; set; }
                public int Key2 { get; set; }
                public int Sum { get; set; }
                public int Count { get; set; }
                public DateTime GISDATE { get; set; }
                public int GISDOW { get; set; }
                public int GISTIME { get; set; }
                public int RESPONSETIME { get; set; }
                public IEnumerable<Graphic> Graphics { get; set; } // only useful for graphics selection from sliver selection
            
            }


             public static DependencyProperty LineGraphListProperty = DependencyProperty.Register(
                "LineGraphList", 
                typeof(IEnumerable<object>),
                typeof(AttributeGroup),
                 null); 

            public class LineGraphList
            {
                public string Key { get; set; }
                public int Key2 { get; set; }
                public int Sum { get; set; }
                public int Count { get; set; }
                public DateTime GISDATE { get; set; }
                public int GISDOW { get; set; }
                public int GISTIME { get; set; }
                public int RESPONSETIME { get; set; }
                public IEnumerable<Graphic> Graphics { get; set; } // only useful for graphics selection from sliver selection
            
            }
        
        
        }

I really can't figure this one out and I don't know what I should do when you say:

You initialize the first one with the group by TYPECODE, the second one with the group by CALL (instead of initializing the datacontext).

I'm initializing the datacontext at the end of the spatial select complete (private void QueryTask_ExecuteCompleted)

Here's that code...I can't seem to not use datacontext:

 //LINE CHART
             DataContext = graphicsLayer.Graphics.GroupBy(graphic => (int)graphic.Attributes["CALL"],
                            (call, graphics) => new AttributeGroup.LineGraphList
                            {
                              
                               Key2 = call, 
// GISDATE = DateTime.ParseExact(gisdate.ToString(), "yyyyMMdd", System.Globalization.CultureInfo.CurrentCulture),
                               
                               Count = graphics.Count(),
                             //  Sum = graphics.Select(g => (int)g.Attributes["DOW"]).Sum(),
                            
                                Graphics = graphics
                            }).ToArray();

          //END LINE CHART

             // PIE CHART -  create an enumeration of AttributeGroup from the graphics in your layer



             DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["TYPECODE"],
                             (typecode, graphics) => new AttributeGroup.PieGraphList
                             {
                                 Key = typecode,

                                 Count = graphics.Count(),
                                 Sum = graphics.Select(g => (int)g.Attributes["DOW"]).Sum(),
                                 Graphics = graphics

                             }).ToArray();

            //END PIE CHART

Then in XAML you bind the ItemsSource of yours charts to these properties (instead of ItemsSource="{Binding}").

I haven't tried to switch the binding because I can't seem to shake the DataContext

Note : you don't need the new Key2 property, you can use the same Key property for both groups of graphics.

I think I know what you are saying here but for now I'm still using the Key2 but I will lose it soon.

So since I created or tried to create the two dependency (PieGraphList and LineGraphList) I had to change some of my code where it use to be AttributeGroup now it is AttributeGroup.PieGraphList or AttributeGroup.LineGraphList
Like in my Selection_Change Line

  private void LineSeries_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            var dataPointSeries = sender as DataPointSeries;
            var attributeGroup = dataPointSeries.SelectedItem as AttributeGroup.LineGraphList;
            if (attributeGroup == null)
                return;

            GraphicsLayer selectionGraphicslayer = Map.Layers["MySelectionGraphicsLayer"] as GraphicsLayer;
            foreach (Graphic item in selectionGraphicslayer.Graphics)
                item.Selected = false;

            foreach (var graphic in attributeGroup.Graphics)
            {
                graphic.Select();
            }
        }

Thanks again for all the time and help
Nathalie.

DominiqueBroux

If you want to display both charts at the same time you can't use the DataContext for both charts.

In your control (or your view model), you have to create two dependency properties (or 2 properties) of type IEnumerable<AttributeGroup>.

You initialize the first one with the group by TYPECODE, the second one with the group by CALL (instead of initializing the datacontext).

Then in XAML you bind the ItemsSource of yours charts to these properties (instead of ItemsSource="{Binding}").

Note : you don't need the new Key2 property, you can use the same Key property for both groups of graphics.

NathalieNeagle

Dominique,

That is what I was thinking so I don't need to create a new class AttributeGroup, right?
XAML FOR MY LINE GRID

        <userControls:CollapsiblePanel x:Name="LineGrid" IsExpanded="False" VerticalAlignment="Top" 
            HorizontalAlignment="Right" Margin="0,75,10,0" Width="420" Height="320" Effect="{StaticResource dropShadow}" >




            <Grid Width="400" Height="300" HorizontalAlignment="Right" VerticalAlignment="Center">

                <Border Background="{StaticResource CommonPanelBorderBackgroundBrush}" BorderBrush="{StaticResource CommonBorderBrush}" BorderThickness="1" CornerRadius="6" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                    <Border Effect="{StaticResource miniDropShadow}" Style="{StaticResource RibbonElementBorder}" Padding="15" Margin="10" >


                        <chartingToolkit:Chart Title="Police DATA">
                            <chartingToolkit:Chart.Series>
                                <chartingToolkit:LineSeries IsSelectionEnabled="True" SelectionChanged="LineSeries_SelectionChanged" 
                                    Title="CAD CALL TYPE" 
                                    ItemsSource="{Binding}" 
                                   IndependentValuePath="KEY2"
                                   DependentValuePath="Count"
                                   
                                />       
                                </chartingToolkit:Chart.Series>
                        </chartingToolkit:Chart>

                    </Border>
                </Border>

                <Image Source="images/CloseX.png" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="3" Stretch="None" Cursor="Hand" ToolTipService.ToolTip="Close" >
                    <i:Interaction.Triggers>
                        <i:EventTrigger EventName="MouseLeftButtonDown" >
                            <actions:ToggleCollapseAction TargetName="LineGrid" />
                        </i:EventTrigger>
                    </i:Interaction.Triggers>
                </Image>

            </Grid>

        </userControls:CollapsiblePanel>

CODE BEHIND WITH TWO DATACONTENT

            // PIE CHART -  create an enumeration of AttributeGroup from the graphics in your layer

            DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["TYPECODE"],
                            (typecode, graphics) => new AttributeGroup
                            {
                                Key = typecode,
                                
                                Count = graphics.Count(),
                                Sum = graphics.Select(g => (int)g.Attributes["DOW"]).Sum(),
                                Graphics = graphics

                            }).ToArray();

            //END PIE CHART

            //LINE CHART
             DataContext = graphicsLayer.Graphics.GroupBy(graphic => (int)graphic.Attributes["CALL"],
                            (call, graphics) => new AttributeGroup
                            {
                              
                              Key2 = call,
                             //  GISDATE = DateTime.ParseExact(gisdate.ToString(), "yyyyMMdd", System.Globalization.CultureInfo.CurrentCulture),
                               
                               Count = graphics.Count(),
                               Sum = graphics.Select(g => (int)g.Attributes["DOW"]).Sum(),
                            
                                Graphics = graphics
                            }).ToArray();

          //END LINE CHART

But this seems to kind of break my pie chart...now my pie chart groups but the legend group names (CAD CALL TYPES) Don't display correctly instead of being names like Homicide, Robbery, or Assualt it is just 1, 2 , and/or 3.

I think I need to assign the DataContext property a new value??? like if it was a type??
private DataContext lineChartDataContent; ?????
then use
lineChartDataContent = graphicsLayer.Graphics.GroupBy(graphic => (int)graphic.Attributes["GISDATE"],
(gisdate, graphics) => new AttributeGroup

Not to sure can you enlighten me

DominiqueBroux

You can't use the same datacontext for your 2 charts both are not using the same grouping.

Create a datacontext by chart instead, eachone with its own group attribute.

NathalieNeagle

Dominique,

I was hoping to ask another question. I created another chart (Bar Chart) and want to re-use all the code but have the bar chart group by a different field. So I thought I could just add a few lines to accomplish but I'm having no luck.

Here' I just add a new Group field called Key2

  public class AttributeGroup
        {
            public string Key { get; set; }
            public int Sum { get; set; }
            public int Count { get; set; }
            public int Key2 { get; set; }
            public IEnumerable<Graphic> Graphics { get; set; } // only useful for graphics selection from sliver selection
        }

Now here's where I'm not sure what/if I can do this.

  DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["TYPECODE"],
                            (typecode, graphics) => new AttributeGroup
                            {
                                Key = typecode,
                                Key2 = graphics.GroupBy(g => (int)g.Attributes["CALL"]), 
                                Count = graphics.Count(),
                                Sum = graphics.Select(g => (int)g.Attributes["DOW"]).Sum(),
                                Graphics = graphics
                               
                            }).ToArray();

This new line is giving me the trouble, is this approach possible?
Key2 = graphics.GroupBy(g => (string)g.Attributes["CALL"]),

I also thought maybe just create a new class named AttributeGroup2 and then create a new enumeration of AttributeGroup2 but I didn't have success.

Nathalie

MuhammadWaqar_ul_islam

As I saw your are displaying the SHAPE_Length in the grid, can you check that there is no special values (such as null or infinity) that could explain why the sum is crashing?

If it's the case, you may need a converter to replace these special values by something else (likely 0).
If it's not the case, I guess you need more debugging to figure out what are the lengths when the sum is crashing.

Hope this help.

i have calculate the sum of values of feild Integer (works fine showing values in the pie as well in the attributes table and Shape_lenght values too ) i m attaching snap shoot of that

Length.jpg

DominiqueBroux

WHAT NEXT TO DO TO SOLVE THIS ISSUE

As I saw your are displaying the SHAPE_Length in the grid, can you check that there is no special values (such as null or infinity) that could explain why the sum is crashing?

If it's the case, you may need a converter to replace these special values by something else (likely 0).
If it's not the case, I guess you need more debugging to figure out what are the lengths when the sum is crashing.

Hope this help.

MuhammadWaqar_ul_islam

Check :
that the attribute SHAPE_Length is exposed by your service,
that your are using the right case
and that you included this attribute in the list of returned attributes (i.e. OutFields="*" or OutFields="........, SHAPE_Length")

1) i Have check SHAPE_Length is exposed in my services (services pics is attached)
2) i m using right case SHAPE_Length
3) list of returned attributes
// Specify fields to return from query
            query.OutFields.AddRange(new string[] { "GISUTPLDS2", "GISUTPL_IMT", "GISUTPL_IYR", "GISUTPL_DIA", "GISUTPLFC", "SHAPE_Length" });
            query.Geometry = args.Geometry;
<slData:DataGrid.Columns>
                        <slData:DataGridTextColumn CanUserSort="True" SortMemberPath="GISUTPLDS2" Binding="{Binding Attributes[GISUTPLDS2]}" Header="Name"/>
                        <slData:DataGridTextColumn CanUserSort="False" Binding="{Binding Attributes[GISUTPL_IMT]}" Header="MONTH"/>
                        <slData:DataGridTextColumn CanUserSort="False" Binding="{Binding Attributes[GISUTPL_IYR]}" Header="YEAR"/>
                        <slData:DataGridTextColumn CanUserSort="False" Binding="{Binding Attributes[GISUTPL_DIA]}" Header="DIA"/>
                        <slData:DataGridTextColumn CanUserSort="False" Binding="{Binding Attributes[GISUTPLFC]}" Header="MATERIAL"/>
                        <slData:DataGridTextColumn CanUserSort="True" SortMemberPath="SHAPE_Length" Binding="{Binding Attributes[SHAPE_Length]}" Header="Length"/>
                    </slData:DataGrid.Columns>
                </slData:DataGrid>

-----------------------------------------------------------------------

WHAT NEXT TO DO TO SOLVE THIS ISSUE
--------------------------------------------------------------------------

services.jpg

DominiqueBroux

Check :

that the attribute SHAPE_Length is exposed by your service,
that your are using the right case
and that you included this attribute in the list of returned attributes (i.e. OutFields="*" or OutFields="........, SHAPE_Length")

MuhammadWaqar_ul_islam

I little Query in Pie Chart Value
i Want to calculate values of field (Shape_lenght) data type (double) of a line feature

DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["GISUTPL_DIA"],
                            (GISUTPL_DIA, graphics) => new AttributeGroup
                            {
                               Key = GISUTPL_DIA,
                                Count = graphics.Count(),
                   Sum = graphics.Select(g => (double)g.Attributes["SHAPE_Length"]).Sum(),                                Graphics = graphics
                            }).ToArray();

public class AttributeGroup
        {
          public string Key { get; set; }
            public double    Sum { get; set; }
            public int Count { get; set; }

            public IEnumerable<Graphic> Graphics { get; set; } // only useful for graphics selection from sliver selection
        }

GOT AN ERROR ON
Sum = graphics.Select(g => (double)g.Attributes["SHAPE_Length"]).Sum(),

Untitled.jpg

MuhammadWaqar_ul_islam

thanks its working

SteveVidal

NathalieNeagle
I have a simple police application that allows officers to spatial select and query some points (police calls).

Hi Nathalie,

I apologise in advance for highjacking this thread, but I work on a police application (for Queensland Police in Australia), and I was thrilled when I read that you do too.

If that's ok with you I would like to get in touch and share some technical info. I know that posting a request like this on the esri forum is a bit clumsy but that was the best way I could think of! My email address is: Vidal.SteveA@police.qld.gov.au

Cheers,
Steve

NathalieNeagle

Dominique,

Thanks!

That's likely the point. The selection of a FeatureDataGrid is automatically synchronized with the graphic selection. So you can simply remove these lines:
Code:

if (QueryDetailsDataGrid.ItemsSource != null && QueryDetailsDataGrid.ItemsSource.Cast<Graphic>().Contains(graphic))
QueryDetailsDataGrid.SelectedItems.Add(graphic);

That being said, I don't understand, how this code could have compiled if QueryDetailsDataGrid was a FeatureDataGrid

Based off of your response I took out this code:

  QueryDetailsDataGrid.SelectedItem = null;

            foreach (var graphic in attributeGroup.Graphics)
            {
                QueryDetailsDataGrid.SelectedItems.Add(graphic);
                graphic.Select();
            }

And replaced it with this code:

 foreach (var graphic in attributeGroup.Graphics)
            {
                graphic.Select();
            }

Now the graphics/cad police points seem to be interacting with the Pie Chart nicely; I have a cherry on the pie;)

It doesn't seem to be selecting my featuregrid rows only when I hoover over the graphic point or click on the graphic point does the table row get selected.

I guess I'm wondering what this line is doing

item.Selected =true;

I changed it to False and it didn't really seem like it effect anything.

Thanks
Nat.

DominiqueBroux

I need final Code in ( Xaml and C#) for pie chart while using Interactive sample of Spatil Query

I've attached the modified files to this thread.With these modifications, you get a Pie chart of the population by region.

SpatialQuery.zip

DominiqueBroux

In the original example http://help.arcgis.com/en/webapi/sil...m#SpatialQueryI don't see the line
QueryDetailsDataGrid.ItemsSource = featureSet.Features;

You are right, it's done by a binding in MyDrawSurface_DrawComplete. I don't remember why I changed that in my version but anyway that should not change anything.

I guess I just noticed the example is using a DataGrid and I'm using a FeatureDataGrid so i'm not sure if that makes a difference.

That's likely the point. The selection of a FeatureDataGrid is automatically synchronized with the graphic selection. So you can simply remove these lines:

   if (QueryDetailsDataGrid.ItemsSource != null && QueryDetailsDataGrid.ItemsSource.Cast<Graphic>().Contains(graphic))
        QueryDetailsDataGrid.SelectedItems.Add(graphic);

That being said, I don't understand, how this code could have compiled if QueryDetailsDataGrid was a FeatureDataGrid

MuhammadWaqar_ul_islam

Dear NathalieNeagle & Dominique,
I need final Code in ( Xaml and C#) for pie chart while using Interactive sample of Spatil Query
http://help.arcgis.com/en/webapi/silverlight/samples/start.htm#SpatialQuery
& my request to ESRI PERSON to add Reports and Pie chart in Interactive Sample
thanks to both of You

NathalieNeagle

O.K. I think I am close and hopefully I will stop bothering you soon.

When and How is set the ItemsSource of your QueryDetailsDataGrid?

In the initial sample, it was done in QueryTask_ExecuteComplete:

        private void QueryTask_ExecuteCompleted(object sender, ESRI.ArcGIS.Client.Tasks.QueryEventArgs args)
        {
            FeatureSet featureSet = args.FeatureSet;
            QueryDetailsDataGrid.ItemsSource = featureSet.Features;

In the original example http://help.arcgis.com/en/webapi/silverlight/samples/start.htm#SpatialQueryI don't see the line
QueryDetailsDataGrid.ItemsSource = featureSet.Features;

AND I don't have the QueryDetailsDataGrid.ItemsSource = featureSet.Features;
line in my code.

And if I add it to my code it breaks my spatial selection...unless I add it to the end. Then it works but my table is filled with feature geometry attributes like (Geometry, Symbol, Attributes, MapTip, TimeExtent, Selected, etc. ) instead of the attributes of the feature but it does seem like the chart is working --- kind of -- when I click on a slice of pie it selects the graphic and rows but when I click on another slice it doesn't deselect the original graphic/row...The Selected field is checked boxes and once they are checked they stayed check.

Here's my private void QueryTask_ExecuteCompleted(object sender, ESRI.ArcGIS.Client.Tasks.QueryEventArgs args)

I guess I just noticed the example is using a DataGrid and I'm using a FeatureDataGrid so i'm not sure if that makes a difference.

Should I just add that one line of code somewhere? Thanks Again!

        private void QueryTask_ExecuteCompleted(object sender, ESRI.ArcGIS.Client.Tasks.QueryEventArgs args)
        {
            FeatureSet featureSet = args.FeatureSet;
           

            if (featureSet == null || featureSet.Features.Count < 1)
            {
                MessageBox.Show("No features retured from query");
                return;
            }

            GraphicsLayer graphicsLayer = Map.Layers["MySelectionGraphicsLayer"] as GraphicsLayer;

           

            if (featureSet != null && featureSet.Features.Count > 0)

            // ResultsDisplay.Visibility = Visibility.Visible;
            {
                foreach (Graphic feature in featureSet.Features)
                {

                    switch (featureSet.GeometryType.ToString())
                    {
                        case "Polygon":
                            feature.Symbol = LayoutRoot.Resources["ResultsFillSymbol"] as FillSymbol;
                            break;
                        case "Polyline":
                            feature.Symbol = LayoutRoot.Resources["CustomGrowLineSymbol"] as LineSymbol;
                            break;
                        case "Point":
                            feature.Symbol = LayoutRoot.Resources["ResultsMarkerSymbol"] as SimpleMarkerSymbol;
                            break;
                    }

                    graphicsLayer.Graphics.Insert(0, feature);
                    
                }
                //ResultsDisplay.Visibility = Visibility.Visible;
                ResultsDisplay.IsExpanded = true;

                
            }

            MyDrawSurface.IsEnabled = false;


            




            // PIE CHART -  create an enumeration of AttributeGroup from the graphics in your layer

            DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["TYPECODE"],
                            (typecode, graphics) => new AttributeGroup
                            {
                                Key = typecode,
                                Count = graphics.Count(),
                                Sum = graphics.Select(g => (int)g.Attributes["DOW"]).Sum(),
                                Graphics = graphics
                            }).ToArray();

            //END PIE CHART



        }

DavidAshton

Great post learning alot

DominiqueBroux

When and How is set the ItemsSource of your QueryDetailsDataGrid?

In the initial sample, it was done in QueryTask_ExecuteComplete:

        private void QueryTask_ExecuteCompleted(object sender, ESRI.ArcGIS.Client.Tasks.QueryEventArgs args)
        {
            FeatureSet featureSet = args.FeatureSet;
            QueryDetailsDataGrid.ItemsSource = featureSet.Features;

By security, we can check that the graphic exists in the grid before selecting it:
foreach (var graphic in attributeGroup.Graphics) { if (QueryDetailsDataGrid.ItemsSource != null && QueryDetailsDataGrid.ItemsSource.Cast<Graphic>().Contains(graphic)) QueryDetailsDataGrid.SelectedItems.Add(graphic); graphic.Select(); }That should avoid the crash but the rows will probably not get selected if there is an issue with the initialization of ItemsSource.

NathalieNeagle

Dominique,

Thanks again for all the help! I set a break point at:

 private void PieSeries_SelectionChanged(object sender, SelectionChangedEventArgs e)

right when I clicked on a slice of the pie it jumped to V.S. and I started stepping through the code.

Once it hits the for loop:

foreach (Graphic item in selectionGraphicslayer.Graphics)
                item.Selected = false;

I have to jump through the for loop X times for X amount of points/graphics...seems right.

Then it moves on into the next for loop

 {
                QueryDetailsDataGrid.SelectedItems.Add(graphic);
                graphic.Select();
            }

and then it finally fails at

QueryDetailsDataGrid.SelectedItems.Add(graphic);

Message: Unhandled
Here's the error message and I attached the screen shot: not to sure what to make of it. Any ideas?

Error in Silverlight Application
Code: 4004
Category: ManagedRuntimeError
Message: System.ArgumentException: The item is not contained in the ItemsSource.
Parameter name: dataItem
at System.Windows.Controls.DataGridSelectedItemsCollection.Add(Object dataItem)
at TabbedRibbon.MainPage.PieSeries_SelectionChanged(Object sender, SelectionChangedEventArgs e)
at System.Windows.Controls.DataVisualization.Charting.DataPointSeries.OnSelectedItemPropertyChanged(Object oldValue, Object newValue)
at System.Windows.Controls.DataVisualization.Charting.DataPointSeries.OnSelectedItemPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
at System.Windows.DependencyObject.RaisePropertyChangeNotifications(DependencyProperty dp, Object oldValue, Object newValue)
at System.Windows.DependencyObject.UpdateEffectiveValue(DependencyProperty property, EffectiveValueEntry oldEntry, EffectiveValueEntry& newEntry, ValueOperation operation)
at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value, Boolean allowReadOnlySet)
at System.Windows.DependencyObject.SetValue(DependencyProperty dp, Object value)
at System.Windows.Controls.DataVisualization.Charting.DataPointSeries.set_SelectedItem(Object value)
at System.Windows.Controls.DataVisualization.Charting.DataPointSeries.Select(DataPoint dataPoint)
at System.Windows.Controls.DataVisualization.Charting.DataPointSeries.OnDataPointIsSelectedChanged(Object sender, RoutedPropertyChangedEventArgs`1 e)
at System.Windows.Controls.DataVisualization.Charting.DataPoint.OnIsSelectedPropertyChanged(Boolean oldValue, Boolean newValue)
at System.Windows.Controls.DataVisualization.Charting.DataPoint.OnIsSelectedPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
at System.Windows.DependencyObject.RaisePropertyChangeNotifications(DependencyProperty dp, Object oldValue, Object newValue)
at System.Windows.DependencyObject.UpdateEffectiveValue(DependencyProperty property, EffectiveValueEntry oldEntry, EffectiveValueEntry& newEntry, ValueOperation operation)
at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value, Boolean allowReadOnlySet)
at System.Windows.DependencyObject.SetValue(DependencyProperty dp, Object value)
at System.Windows.Controls.DataVisualization.Charting.DataPoint.set_IsSelected(Boolean value)
at System.Windows.Controls.DataVisualization.Charting.DataPoint.OnMouseLeftButtonDown(MouseButtonEventArgs e)
at System.Windows.Controls.Control.OnMouseLeftButtonDown(Control ctrl, EventArgs e)
at MS.Internal.JoltHelper.FireEvent(IntPtr unmanagedObj, IntPtr unmanagedObjArgs, Int32 argsTypeIndex, Int32 actualArgsTypeIndex, String eventName)

Line: 54
Char: 13
Code: 0
URI: http://localhost:49827/Web/

no explosion
Nathalie

ERROR.jpg

DominiqueBroux

So the question is : 'How to make the cherry bomb explode? 🙂

Unfortunately I can't figure out where your issue is.

Check that you hooked up the selection changed handler and set IsSelectinEnabled to true:

<chartingToolkit:PieSeries IsSelectionEnabled="True"SelectionChanged="PieSeries_SelectionChanged" 
                                   ItemsSource="{Binding}"

Then try debugging step by step the 'PieSeries_SelectionChanged' code: 'attributeGroup.Graphics' should contain the graphics corresponding to your typecode.

Good luck.

BTW : to keep the colors from VS, paste the code after creating the tags.

NathalieNeagle

Dominique,

O.K. I can't stop giggling or more appropiately stop laughing about your play on words " Cherry on the pie" 😄

And of course strange enough those four words �??Cherry on the pie�?� have been making me laugh all day but it is this section of the code that I can�??t get working. It is weird when I select a row (attribute in the feature grid table) and then click on the pie map it unselects my selected row but when I click on a slice of the pie it doesn�??t select the rows in the table and it doesn�??t select the features on the map.

I basically started with the spatial select tools just like you so I think everything is the same:

My featuredatagrid is named the same

                            <esriWidgets:FeatureDataGrid Grid.Row="1" x:Name="QueryDetailsDataGrid" Height="170" 
                                      Map="{Binding ElementName=Map}" 
                                      GraphicsLayer="{Binding Layers[MySelectionGraphicsLayer], ElementName=Map}" Style="{StaticResource FeatureDataGridStyle1}" />

I think my spatial query task is basically the same I did add a little but the key elements are there:

  private void MyDrawSurface_DrawComplete(object sender, ESRI.ArcGIS.Client.DrawEventArgs args)
        {


            GraphicsLayer selectionGraphicslayer = Map.Layers["MySelectionGraphicsLayer"] as GraphicsLayer;
            selectionGraphicslayer.ClearGraphics();


            QueryTask queryTask = new QueryTask((Layers.SelectedItem as FeatureLayer).Url);
 
            queryTask.ExecuteCompleted += QueryTask_ExecuteCompleted;
            queryTask.Failed += QueryTask_Failed;

            Query query = new ESRI.ArcGIS.Client.Tasks.Query();

            query.OutFields.Add("*");

            query.Geometry = args.Geometry;



            // Return geometry with result features
            query.ReturnGeometry = true;

            queryTask.ExecuteAsync(query);



        }

        private void QueryTask_ExecuteCompleted(object sender, ESRI.ArcGIS.Client.Tasks.QueryEventArgs args)
        {
            FeatureSet featureSet = args.FeatureSet;

            if (featureSet == null || featureSet.Features.Count < 1)
            {
                MessageBox.Show("No features retured from query");
                return;
            }

            GraphicsLayer graphicsLayer = Map.Layers["MySelectionGraphicsLayer"] as GraphicsLayer;


            if (featureSet != null && featureSet.Features.Count > 0)

               // ResultsDisplay.Visibility = Visibility.Visible;

            {
                foreach (Graphic feature in featureSet.Features)
                {

                    switch (featureSet.GeometryType.ToString())
                    {
                        case "Polygon":
                            feature.Symbol = LayoutRoot.Resources["ResultsFillSymbol"] as FillSymbol;
                            break;
                        case "Polyline":
                            feature.Symbol = LayoutRoot.Resources["CustomGrowLineSymbol"] as LineSymbol;
                            break;
                        case "Point":
                            feature.Symbol = LayoutRoot.Resources["ResultsMarkerSymbol"] as SimpleMarkerSymbol;
                            break;
                    }

                    graphicsLayer.Graphics.Insert(0, feature);

                }
                //ResultsDisplay.Visibility = Visibility.Visible;
                ResultsDisplay.IsExpanded = true;
            }
            MyDrawSurface.IsEnabled = false;






            // PIE CHART -  create an enumeration of AttributeGroup from the graphics in your layer

            DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["TYPECODE"],
                            (typecode, graphics) => new AttributeGroup
                            {
                                Key = typecode,
                                Count = graphics.Count(),
                                Sum = graphics.Select(g => (int)g.Attributes["DOW"]).Count(),
                               //Sum = graphics.Select(g => (int)g.Attributes["DOW"]).Sum),
                                Graphics = graphics
                            }).ToArray();

            //END PIE CHART

So does it matter where I add the Cherry! lol. I don't think it should right? Just somewhere in the code behind?

Do you see anything that is off?

Oh ya how do you copy your code and retain the easy to read feel (the colors) like it is still in V.S.?

Thanks again

Nathalie "Cherry Bomb" Neagle --- just kinding:o

DominiqueBroux

Hi Nathalie,

Looks like you don't need a piece of pie by graphic but by group of graphics.
In this case, the following binding can't do the trick:

ItemsSource="{Binding ElementName=Map, Path=Layers[MySelectionGraphicsLayer].Graphics}"

You need to create by code your groups of graphics and to bind the chart to these groups.

For demo purpose, I did it starting from this sample : http://help.arcgis.com/en/webapi/silverlight/samples/start.htm#SpatialQuery.
Let's suppose that you want to show the population by region.

The steps are:

1) As it's not easy to use anonymous type in SL, you need to create a public class to store the result of your grouping :
public class AttributeGroup {     public string Key { get; set; }     public int Sum { get; set; }     public int Count { get; set; }     public IEnumerable<Graphic> Graphics {get; set;} // only useful for graphics selection from sliver selection }2) You need to create an enumeration of AttributeGroup from the graphics in your layer:

At the end of QueryExecuted_Completed, add:
DataContext = graphicsLayer.Graphics.GroupBy(graphic => (string)graphic.Attributes["SUB_REGION"],                             (subregion, graphics) => new AttributeGroup                             {                                 Key = subregion,                                 Count = graphics.Count(),                                 Sum = graphics.Select(g => (int)g.Attributes["POP2000"]).Sum(),                                 Graphics = graphics                             }).ToArray();
Note : a cleaner approach would have been to create a new Dependency property (or a new property with change notification) and to use it instead of the DataContext.

3) Bind the chart ItemsSource to this enum <Grid Width="400" Height="300" HorizontalAlignment="Left" VerticalAlignment="Top"> <chartingToolkit:Chart Title="Population by Region" > <chartingToolkit:PieSeries IsSelectionEnabled="True" SelectionChanged="PieSeries_SelectionChanged"                                    ItemsSource="{Binding}"                                    IndependentValuePath="Key"                                    DependentValuePath="Sum" AnimationSequence="FirstToLast"/> </chartingToolkit:Chart> </Grid>
Note : or ItemsSource="{Binding MyGroups}" if you had created a new property called MyGroups.

4) Cherry on the pie : select the corresponding graphics when one selects a piece of pie:private void PieSeries_SelectionChanged(object sender, SelectionChangedEventArgs e) {     var dataPointSeries = sender as DataPointSeries;     var attributeGroup = dataPointSeries.SelectedItem as AttributeGroup;     if (attributeGroup == null)         return;     GraphicsLayer selectionGraphicslayer = MyMap.Layers["MySelectionGraphicsLayer"] as GraphicsLayer;     foreach (Graphic item in selectionGraphicslayer.Graphics)         item.Selected = false;     QueryDetailsDataGrid.SelectedItem = null;     foreach (var graphic in attributeGroup.Graphics)     {         QueryDetailsDataGrid.SelectedItems.Add(graphic);         graphic.Select();     } }And that's it (see attached result)

PieChart.jpg

NathalieNeagle

Dominique,

VERY COOL....THANKS FOR ALL THE HELP!:)

I was hoping to ask one more simple question. So I have it working; well sort of:eek:

The chart is populating and the site is functioning. But if the crime code repeats (if there is more than one selected) both or all of the same crime codes get there own piece of the pie. Also the count is always working out to 22 no matter what (if 1,2,3,4, or 5 of the same crime codes are selected) they each get a sliver of the pie and the count for each is 22.

Here's my xaml --- does it look like I'm doing the count correctly. Counting is exactly what fits my needs for the pie chart.

<Grid Style="{StaticResource WrapperStyle}" >
            <Border BorderBrush="Black" BorderThickness="1">
                <controlsToolkit:DockPanel>
                    <visualizationToolkit:Title Content="Drill-Down" FontWeight="Bold" FontSize="14" HorizontalAlignment="Center" controlsToolkit:DockPanel.Dock="Top"/>
                    <controlsToolkit:DockPanel LastChildFill="False" controlsToolkit:DockPanel.Dock="Right">
                        <StackPanel x:Name="InformationPanel" controlsToolkit:DockPanel.Dock="Top" Margin="5">
                            <TextBlock Text="Selected Call Type Details" FontWeight="Bold"/>
                            <StackPanel Orientation="Horizontal">
                                <TextBlock Text="TYPE CODE: "/>
                                <TextBlock Text="{Binding  Attributes[TYPECODE]}"/>
                            </StackPanel>
                            <StackPanel Orientation="Horizontal">
                                <TextBlock Text="COUNT: "/>
                                <TextBlock Text="{Binding Attributes.Count}"/>
                            </StackPanel>
                        </StackPanel>
                        <Button Content="Unselect" Click="Unselect_Click" Margin="5" controlsToolkit:DockPanel.Dock="Bottom"/>
                    </controlsToolkit:DockPanel>
                    <chartingToolkit:Chart x:Name="DrillDownChart" BorderBrush="Gray" Margin="5">
                        <chartingToolkit:Chart.Series>
                            <chartingToolkit:PieSeries ItemsSource="{Binding ElementName=Map, Path=Layers[MySelectionGraphicsLayer].Graphics}" IndependentValueBinding="{Binding  Attributes[TYPECODE]}" DependentValueBinding="{Binding Attributes.Count}" IsSelectionEnabled="True" SelectionChanged="DrillDown_SelectionChanged"/>
                        </chartingToolkit:Chart.Series>
                    </chartingToolkit:Chart>
                </controlsToolkit:DockPanel>
            </Border>
        </Grid>

Thanks again for all the help and thanks to Jennifer too:D

Nathalie

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.