This is a migrated thread and some comments may be shown as answers.

How to create template for kml elements?

1 Answer 179 Views
Map
This is a migrated thread and some comments may be shown as answers.
Eirik
Top achievements
Rank 1
Eirik asked on 04 Feb 2011, 09:46 AM
Hi!
How can i create a template that works on every element in a kml file i load from my computer?

.cs:
Loading the kml file works fine:   

            try
            {
                FileStream streamResource = File.Open("c:\\mapsource\\wildlife.kml",FileMode.Open,FileAccess.Read);
                List<FrameworkElement> elements = Telerik.Windows.Controls.Map.KmlReader.Read(streamResource);


                foreach (FrameworkElement element in elements)
                {
                    this.informationLayer.Items.Add(element);
                }
            }
            catch (Exception e)
            {
                MessageBox.Show("Error: " + e);
            }

.xaml:
<StackPanel>
        <Label HorizontalContentAlignment="Center" Content="Map" Width="{Binding Source={StaticResource configSource}, Path=DefaultMapWidth}" Height="30" Background="Gray"></Label>
        <telerik:RadMap x:Name="radMap"  Width="{Binding Source={StaticResource configSource}, Path=DefaultMapWidth}" Height="{Binding Source={StaticResource configSource}, Path=DefaultMapHeight}"
                            MouseDragMode="Drag"
                            ZoomBarVisibility="Collapsed"
                            NavigationVisibility="Collapsed">
            <telerik:InformationLayer x:Name="informationLayer">
                <telerik:InformationLayer.ItemTemplate>
                    <DataTemplate>
                        <Grid telerik:MapLayer.BaseZoomLevel="5" >
                            
                        </Grid>
                    </DataTemplate>
                </telerik:InformationLayer.ItemTemplate>
                <!--<telerik:InformationLayer.Reader>
                    <telerik:MapShapeReader Source="c:/mapsource/Oil_Spills.kml" SourceType="Kml"/>
                </telerik:InformationLayer.Reader>-->
            </telerik:InformationLayer>
        </telerik:RadMap>
    </StackPanel>


KML:
Here's a part of the kml file that i'm using:

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.1">
        <Document>
        <name>wildlife-national-parks-india.kml</name>


        <Placemark>
        <name>Anshi National Park</name>
              <description>
                <![CDATA[
                  <p>Wildlife: Bonnet Macaque, Deer, Mouse Deer, Spotted Deer, Indian Bison, Malabar Civet, Malabar Giant Squirrel, Pangolin, Sloth Bear, Black Panther, Elephants, Tigers, Adjutant Stork, Ashy Woodswallow, Black-cre... </p>
                  <p>Plan your wildlife adventure holiday to <a href="http://www.world-wildlife-adventures.com/directory/india/wildlife-park.asp?sanctuary=Anshi+National+Park&state=Karnataka">Anshi National Park</a>, India...
                   read reviews by fellow wildlife enthusiasts, and share your own.  For information about other parks in India and the rest of the world visit: <a href="http://www.world-wildlife-adventures.com/">World Wildlife Adventures</a></p>
                ]]>
              </description>
        <Point>
        <coordinates>74.39598,15.07237,0</coordinates>
        </Point>
        </Placemark>
        <Placemark>
        <name>Balphakram National Park</name>
              <description>
                <![CDATA[
                  <p>Wildlife: Indian Elephant, Bengal Tiger, Leopard, Clouded Leopard, Wild Buffalo, Gaur (Indian Bison), Muntjac (Barking Deer), Hoolock (White-browed) Gibbon, Assamese Macaque, Pig-tailed Macaque, Capped Langur (... </p>
                  <p>Plan your wildlife adventure holiday to <a href="http://www.world-wildlife-adventures.com/directory/india/wildlife-park.asp?sanctuary=Balphakram+National+Park&state=Meghalaya">Balphakram National Park</a>, India...
                   read reviews by fellow wildlife enthusiasts, and share your own.  For information about other parks in India and the rest of the world visit: <a href="http://www.world-wildlife-adventures.com/">World Wildlife Adventures</a></p>
                ]]>
              </description>
        <Point>
        <coordinates>90.82664,25.25261,0</coordinates>
        </Point>
        </Placemark>


It's important that i'm able to format the name and description.
I did not find any examples on this, so i hope you can help.

Thanks in advance.

1 Answer, 1 is accepted

Sort by
0
Andrey
Telerik team
answered on 09 Feb 2011, 10:09 AM
Hi Eirik,

You can override a standard style for the MapPinPoint to customize its appearance.
Each MapPinPoint which is returned from the KmlReader contains the ExtendedData property. You can use it to get the Name and Description of Placemark. Also you can add necessary properties to the ExtendedData for binding them later in the custom template.
The sample code is below.
<Window x:Class="KmlTemplating.MainWindow"
        Title="MainWindow" Height="600" Width="800">
    <Window.Resources>
        <telerik:ExtendedDataConverter x:Key="ExtendedDataConverter" />
  
        <Style TargetType="telerik:MapPinPoint">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="telerik:MapPinPoint">
                        <Border Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}" 
                                BorderThickness="1" 
                                CornerRadius="3"
                                Padding="2,2,2,2">
                            <Grid Name="PART_Panel">
                                <ToolTipService.ToolTip>
                                    <ToolTip Content="{TemplateBinding ExtendedData, Converter={StaticResource ExtendedDataConverter}, ConverterParameter=FormattedDescription}" />
                                </ToolTipService.ToolTip>
                                <Image Name="PART_Image" 
                                       Stretch="None" 
                                       Source="{TemplateBinding ImageSource}" 
                                       Width="32" 
                                       Height="32" />
                                <TextBlock Name="PART_Text" 
                                           VerticalAlignment="Center" 
                                           HorizontalAlignment="Center"
                                           Text="{TemplateBinding Text}" />
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <telerik:RadMap x:Name="radMap"
                        Center="15.07237,74.39598"
                        ZoomLevel="9">
            <telerik:RadMap.Provider>
                <telerik:OpenStreetMapProvider IsTileCachingEnabled="True" />
            </telerik:RadMap.Provider>
            <telerik:InformationLayer x:Name="informationLayer" />
        </telerik:RadMap>
    </Grid>
</Window>
public MainWindow()
{
    InitializeComponent();

    
try
    {
        FileStream streamResource = File.Open("c:\\mapsource\\wildlife.kml", FileMode.Open, FileAccess.Read);
        List<FrameworkElement> elements = Telerik.Windows.Controls.Map.KmlReader.Read(streamResource);

        
foreach (FrameworkElement element in elements)
        {
            MapPinPoint point = element as MapPinPoint;
            if (point != null)
            {
                // get description
                // Placemark.Name could be used to get the Name of Placemark
                string description = (string)point.ExtendedData.GetValue("Placemark.Description");

                
// format description to a control
                ContentControl control = this.GetFormattedDescription(description);

                
// register the FormattedDescription property
                point.ExtendedData.PropertySet.RegisterProperty("FormattedDescription", "", typeof(ContentControl), null);

                
// add the control to ExtendedData
                point.ExtendedData.SetValue("FormattedDescription", control);
            }

            
this.informationLayer.Items.Add(element);
        }
    }
    catch (Exception e)
    {
        MessageBox.Show("Error: " + e);
    }
}

private
ContentControl GetFormattedDescription(string description)
{
    // format of description to control should be implemented
    // ...
    ContentControl control = new ContentControl();
    control.Content = description;

    
return control;
}

Kind regards,
Andrey Murzov
the Telerik team
Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
Tags
Map
Asked by
Eirik
Top achievements
Rank 1
Answers by
Andrey
Telerik team
Share this question
or