Combined geometry in telerik maps

4 posts, 0 answers
  1. Massimo
    Massimo avatar
    21 posts
    Member since:
    Apr 2013

    Posted 26 Sep Link to this post

    What's the easyest way to draw someting like a combined geometry in a map? http://www.blackwasp.co.uk/WPFCombinedGeometry.aspx

    I have a series of ellipse with a trasparency, but, when 2 or more ellipse are overlapped the opacity are reduced and I can't see the map below.

    I just want to combile all the geometry and have a unique item..

  2. Martin
    Admin
    Martin avatar
    1099 posts

    Posted 29 Sep Link to this post

    Hi Massimo,

    RadMap can work with FrameworkElements so you can use native Path element and draw the combined geometry which you want.  Basically, you can define a VisualizationLayer and add the Path there.
    <telerik:RadMap Center="24,40" ZoomLevel="4">
        <telerik:RadMap.Provider>
            <telerik:OpenStreetMapProvider />
        </telerik:RadMap.Provider>
        <telerik:VisualizationLayer>
            <Path Stroke="Black" StrokeThickness="5" Fill="HotPink" telerik:MapLayer.Location="40,40">
                <Path.Data>
                    <CombinedGeometry>
                        <CombinedGeometry.Geometry1>
                            <EllipseGeometry Center="70,70" RadiusX="60" RadiusY="56" />
                        </CombinedGeometry.Geometry1>
                        <CombinedGeometry.Geometry2>
                            <RectangleGeometry Rect="70,70 150,80" />
                        </CombinedGeometry.Geometry2>
                    </CombinedGeometry>
                </Path.Data>
            </Path>    
        </telerik:VisualizationLayer>               
    </telerik:RadMap>
    If you want your shape to respect the map zoom level you can use Map Shape Data objects and more specifically the PathData object. Its size are in the map's reference units (degrees). Note that the PathData works with custom map geometry objects.
    <telerik:RadMap Center="24,40" ZoomLevel="4">
        <telerik:RadMap.Provider>
            <telerik:OpenStreetMapProvider />
        </telerik:RadMap.Provider>
        <telerik:VisualizationLayer>       
            <telerik:PathData Location="40,40">
                <telerik:PathData.ShapeFill>
                    <telerik:MapShapeFill Fill="HotPink" Stroke="Black" StrokeThickness="5" />
                </telerik:PathData.ShapeFill>
                <telerik:PathData.Data>                       
                    <telerik:GeometryGroupData>
                        <telerik:GeometryGroupData.Children>
                            <telerik:EllipseGeometryData Center="40,70" RadiusX="6.5" RadiusY="5" />
                            <telerik:RectangleGeometryData Rect="40,70, 1300,800"  />
                        </telerik:GeometryGroupData.Children>
                    </telerik:GeometryGroupData>
                </telerik:PathData.Data>
            </telerik:PathData>
        </telerik:VisualizationLayer>               
    </telerik:RadMap>

    Regards,
    Martin
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  3. UI for WPF is Visual Studio 2017 Ready
  4. Massimo
    Massimo avatar
    21 posts
    Member since:
    Apr 2013

    Posted 30 Sep Link to this post

    Thank you for the reply,

    the "Map Shape Data" is almost what I needed, but the result is a XOR of the shapes (first attach), It would be nice an union of the shapes, something like the second attach..

  5. Martin
    Admin
    Martin avatar
    1099 posts

    Posted 03 Oct Link to this post

    Hello Massimo,

    The map geometry data objects mimics the behavior of the native WPF geometries, but they allow you to work with map reference units. The map's GeometryGroupData is the equivalent of the native GeometryGroup and it exposes a FillRule property which you can use to partially achieve what you are looking for. However, the group geometry in general allows you to merge only the filled part of the shapes. The stroke lines won't be remove where the shapes intersect. Also, the property is not respected in some cases. I tested the geometry generated by the GeometryGroupData with a native GeometryGroup and I was not able to make the FillRule property to work with the geometry from the example in my last reply. You can test it with the geometries which you are going to use and see if it works for you.

    If this doesn't work in your case, you can try the PathGeometryData and construct a single custom geometry instead of merging geometries. Or you can use a native Path element with a CombinedGeometry and re-calculate its boundaries on zoom in/out of the map.

    Regards,
    Martin
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Back to Top