Hey,
as I saw in the Changelog, the map information layer was redesigned. I've been using the map control by adding a custom user control to the information layer and setting its MapLayer.LocationProperty to a Location object. I also tried to use the InformationLay.LocationProperty. None of both work after updating the Controls.
This is the simple code snippet,
Is there any possibility to use a technique like this with the new version? Kind regards and thanks for your help, Jonas
as I saw in the Changelog, the map information layer was redesigned. I've been using the map control by adding a custom user control to the information layer and setting its MapLayer.LocationProperty to a Location object. I also tried to use the InformationLay.LocationProperty. None of both work after updating the Controls.
This is the simple code snippet,
Location actLoc =
new
Location(lat, lon);
PosMapPin actPin =
new
PosMapPin(actPos);
this
.PosLayer.Items.Add(actPin);
Is there any possibility to use a technique like this with the new version? Kind regards and thanks for your help, Jonas
6 Answers, 1 is accepted
0
Hi Jonas,
You can use the same technique to position elements over the map. You didn’t provide any information about PosMapPin control and its code, so I couldn’t test it. But I’ve created a simple application which positions a user control over the map. Here it is a code for my MapPinControl and MainPage (it works fine):
Greetings,
Andrey Murzov
the Telerik team
You can use the same technique to position elements over the map. You didn’t provide any information about PosMapPin control and its code, so I couldn’t test it. But I’ve created a simple application which positions a user control over the map. Here it is a code for my MapPinControl and MainPage (it works fine):
<
UserControl
x:Class
=
"AddUserControlToInfoLayer.MapPinControl"
Width
=
"50"
Height
=
"50"
>
<
Grid
x:Name
=
"LayoutRoot"
Background
=
"Transparent"
>
<
Path
Fill
=
"Red"
>
<
Path.Data
>
<
GeometryGroup
>
<
EllipseGeometry
Center
=
"25,25"
RadiusX
=
"25"
RadiusY
=
"25"
/>
<
EllipseGeometry
Center
=
"25,25"
RadiusX
=
"12"
RadiusY
=
"12"
/>
</
GeometryGroup
>
</
Path.Data
>
</
Path
>
</
Grid
>
</
UserControl
>
using
System;
using
System.Collections.Generic;
using
System.Linq;
using
System.Net;
using
System.Windows;
using
System.Windows.Controls;
using
System.Windows.Documents;
using
System.Windows.Input;
using
System.Windows.Media;
using
System.Windows.Media.Animation;
using
System.Windows.Shapes;
using
Telerik.Windows.Controls.Map;
namespace
AddUserControlToInfoLayer
{
public
partial
class
MapPinControl : UserControl
{
public
MapPinControl(Location location)
{
InitializeComponent();
HotSpot hotspot =
new
HotSpot()
{
X = 0.5,
Y = 0.5
};
MapLayer.SetHotSpot(
this
, hotspot);
MapLayer.SetLocation(
this
, location);
}
}
}
<
UserControl
x:Class
=
"AddUserControlToInfoLayer.MainPage"
xmlns:telerik
=
"http://schemas.telerik.com/2008/xaml/presentation"
mc:Ignorable
=
"d"
d:DesignHeight
=
"500"
d:DesignWidth
=
"600"
>
<
Grid
x:Name
=
"LayoutRoot"
Background
=
"White"
>
<
telerik:RadMap
x:Name
=
"radMap"
Center
=
"0,0"
ZoomLevel
=
"1"
>
<
telerik:RadMap.Provider
>
<
telerik:OpenStreetMapProvider
/>
</
telerik:RadMap.Provider
>
<
telerik:InformationLayer
x:Name
=
"informationLayer"
/>
</
telerik:RadMap
>
</
Grid
>
</
UserControl
>
using
System;
using
System.Collections.Generic;
using
System.Linq;
using
System.Net;
using
System.Windows;
using
System.Windows.Controls;
using
System.Windows.Documents;
using
System.Windows.Input;
using
System.Windows.Media;
using
System.Windows.Media.Animation;
using
System.Windows.Shapes;
using
Telerik.Windows.Controls.Map;
namespace
AddUserControlToInfoLayer
{
public
partial
class
MainPage : UserControl
{
public
MainPage()
{
InitializeComponent();
Location pinLocation =
new
Location(0, 0);
MapPinControl pin =
new
MapPinControl(pinLocation);
this
.informationLayer.Items.Add(pin);
}
}
}
Greetings,
Andrey Murzov
the Telerik team
Browse the videos here>> to help you get started with RadControls for Silverlight
0
invDev
Top achievements
Rank 1
answered on 01 Dec 2010, 01:05 PM
Hi,
your example is really close to our scenario. I just forgott to post one crucial line of code in which I set the Location Property of the custom Pin like this:
actPin.SetValue(MapLayer.LocationProperty, actLoc);
I tried your example as well and with both techniques all pin points are located in the top left corner of the map (which I did not see at first).
This is how the map control is implemented in xaml:
your example is really close to our scenario. I just forgott to post one crucial line of code in which I set the Location Property of the custom Pin like this:
actPin.SetValue(MapLayer.LocationProperty, actLoc);
I tried your example as well and with both techniques all pin points are located in the top left corner of the map (which I did not see at first).
This is how the map control is implemented in xaml:
<
telerik:RadMap
Visibility
=
"Visible"
Canvas.ZIndex
=
"100"
x:Name
=
"PosMap"
CommandBarVisibility
=
"Visible"
DistanceUnit
=
"Kilometer"
NavigationVisibility
=
"Visible"
ScaleVisibility
=
"Visible"
UseSpringAnimations
=
"True"
ZoomBarVisibility
=
"Visible"
ZoomBarPresetsVisibility
=
"Collapsed"
MouseLocationIndicatorVisibility
=
"Collapsed"
Center
=
"50.7871,9.6814"
ZoomLevel
=
"5"
>
<
telerik:RadMap.Provider
>
<
telerikMapping:BingMapProvider
x:Name
=
"PosMapProvider"
></
telerikMapping:BingMapProvider
>
</
telerik:RadMap.Provider
>
<
telerik:InformationLayer
Name
=
"PosLayer"
Canvas.ZIndex
=
"110"
></
telerik:InformationLayer
>
</
telerik:RadMap
>
So, all PinPoint are rendered, but all in the same place.
Greeting, Jonas
0
Accepted
Hi,
The code I've posted there is from a working solution. It works fine on our side, so we can't reproduce the problem. Could you, please, create and provide us with small solution which we could use to reproduce your problem?
Greetings,
Andrey Murzov
the Telerik team
The code I've posted there is from a working solution. It works fine on our side, so we can't reproduce the problem. Could you, please, create and provide us with small solution which we could use to reproduce your problem?
Greetings,
Andrey Murzov
the Telerik team
Browse the videos here>> to help you get started with RadControls for Silverlight
0
invDev
Top achievements
Rank 1
answered on 14 Dec 2010, 12:01 PM
Hey,
I was able to figure our problem with your sample code. Our XAML code of the pintpoint is using a canvas inside the outer grid, which i need for proper positioning of the pin elements. This is the code:
This worked well with the previous release. Perhaps, there is an internal problem addind the margins to the pin? What would be the best way to use a bit more complex pinpoint like this?
Thanks for all your help! Jonas
I was able to figure our problem with your sample code. Our XAML code of the pintpoint is using a canvas inside the outer grid, which i need for proper positioning of the pin elements. This is the code:
<
UserControl
x:Class
=
"PV.UI.Controls.PosMapPin"
mc:Ignorable
=
"d"
>
<
Grid
x:Name
=
"LayoutRoot"
Background
=
"Transparent"
>
<
Canvas
Width
=
"20.4183"
Height
=
"33.3333"
Clip
=
"F1 M 0,0L 20.4183,0L 20.4183,33.3333L 0,33.3333L 0,0"
Margin
=
"-10,-33,0,0"
>
<
Path
Width
=
"20.4183"
Height
=
"33.3333"
Canvas.Left
=
"0"
Canvas.Top
=
"0"
Stretch
=
"Fill"
Fill
=
"#FF878787"
Data
=
"F1 M 0,10.2092C 0,13.9067 1.973,17.1362 4.91693,18.9268L 10.2092,33.3333L 15.5022,18.9268C 18.4446,17.1362 20.4183,13.9067 20.4183,10.2092L 20.4183,10.2092C 20.4183,4.57056 15.8471,0 10.2092,0L 10.2092,0C 4.57128,0 0,4.57056 0,10.2092 Z "
/>
<
Path
Width
=
"19.1537"
Height
=
"31.0429"
Canvas.Left
=
"0.63269"
Canvas.Top
=
"0.630493"
Stretch
=
"Fill"
Fill
=
"#FFF9F9F9"
Data
=
"F1 M 0.63269,10.2092C 0.63269,13.5721 2.35574,16.6296 5.24477,18.3875L 5.45245,18.5151L 5.5207,18.7479L 10.2092,31.6734L 14.8976,18.7479L 14.9651,18.5151L 15.1728,18.3875C 18.0633,16.6296 19.7864,13.5721 19.7864,10.2092L 19.7864,10.2092C 19.7864,4.92731 15.4918,0.630493 10.2092,0.630493L 10.2092,0.630493C 4.92805,0.630493 0.63269,4.92731 0.63269,10.2092 Z "
/>
<
Path
Width
=
"13.4083"
Height
=
"13.4067"
Canvas.Left
=
"3.50541"
Canvas.Top
=
"3.50543"
Stretch
=
"Fill"
Fill
=
"#FF9F9F9F"
Data
=
"F1 M 3.50541,10.2092C 3.50541,13.9119 6.50719,16.9122 10.2092,16.9122L 10.2092,16.9122C 13.9119,16.9122 16.9137,13.9119 16.9137,10.2092L 16.9137,10.2092C 16.9137,6.50647 13.9119,3.50543 10.2092,3.50543L 10.2092,3.50543C 6.50719,3.50543 3.50541,6.50647 3.50541,10.2092 Z "
/>
<
Path
Width
=
"11.9619"
Height
=
"11.9619"
Canvas.Left
=
"4.2286"
Canvas.Top
=
"4.22784"
Stretch
=
"Fill"
Data
=
"F1 M 4.2286,10.2092C 4.2286,13.5128 6.90625,16.1898 10.2092,16.1898L 10.2092,16.1898C 13.5121,16.1898 16.1905,13.5128 16.1905,10.2092L 16.1905,10.2092C 16.1905,6.90558 13.5121,4.22784 10.2092,4.22784L 10.2092,4.22784C 6.90625,4.22784 4.2286,6.90558 4.2286,10.2092 Z "
>
<
Path.Fill
>
<
LinearGradientBrush
StartPoint
=
"0.499974,1.00001"
EndPoint
=
"0.499974,1.53074e-005"
>
<
LinearGradientBrush.GradientStops
>
<
GradientStop
Color
=
"#FFA70465"
Offset
=
"0"
/>
<
GradientStop
Color
=
"#FFFF009A"
Offset
=
"1"
/>
</
LinearGradientBrush.GradientStops
>
</
LinearGradientBrush
>
</
Path.Fill
>
</
Path
>
</
Canvas
>
</
Grid
>
</
UserControl
>
This worked well with the previous release. Perhaps, there is an internal problem addind the margins to the pin? What would be the best way to use a bit more complex pinpoint like this?
Thanks for all your help! Jonas
0
invDev
Top achievements
Rank 1
answered on 14 Dec 2010, 12:06 PM
... adding Width and Height to the LayoutRoot Grid instead to the Canvas workes well...
0
Hello Jonas,
This is the expected behaviour. To get user control right positioned it must be able to provide its size to the information layer. The Canvas don't force parent container to change its size somehow. So in your first variant user control have been resized to fill whole information layer (according to the common Silverlight rules). When you set precise dimensions on the Grid user control pass right size to the information layer, and control is positioned well.
Greetings,
Andrey Murzov
the Telerik team
This is the expected behaviour. To get user control right positioned it must be able to provide its size to the information layer. The Canvas don't force parent container to change its size somehow. So in your first variant user control have been resized to fill whole information layer (according to the common Silverlight rules). When you set precise dimensions on the Grid user control pass right size to the information layer, and control is positioned well.
Greetings,
Andrey Murzov
the Telerik team
Browse the videos here>> to help you get started with RadControls for Silverlight