Map Markers Won't Show

7 posts, 0 answers
  1. ww1711
    ww1711 avatar
    17 posts
    Member since:
    May 2012

    Posted 14 Jun Link to this post

    Pretty simple issue here: when my RadMap is rendered, the markers don't appear.

    If I hover over the point where they should be, I see the pop-up, but I cannot get the physical pinTarget or pin markers to show on the map. I've tried implementing various ways according to the demos and nothing is working. I'm looking to implement via Server-Side Data Binding; I've literally copied the code exactly from the demo and pasted into my solution and it will not work. I am currently running Telerik version 2016.1.113.40

    Any help would be greatly appreciated.

     

    Thanks!

  2. ww1711
    ww1711 avatar
    17 posts
    Member since:
    May 2012

    Posted 14 Jun in reply to ww1711 Link to this post

    An Update:

    It's related to the fact that I've for a custom skin .dll in my project. When I remove the reference to it in the web.config file, all is well. How can I make these work while still using my custom skin? It appears that I've got the proper .css and .png files where they should be...

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 16 Jun Link to this post

    Hello,

    RadMap Markers are rendered by utilizing glyph icon. So, you should make sure that the custom skin created includes the Telerik font. 

    Basically, you should make sure that you have all relevant resources in the skin assembly that is related to RadMap. 

    Regards,
    Ianko
    Telerik
  5. ww1711
    ww1711 avatar
    17 posts
    Member since:
    May 2012

    Posted 16 Jun in reply to Ianko Link to this post

    The markers utilize glyph icon, so I need to ensure I have a font installed...?

    I have map-marker.png in the location of Telerik.Web.UI.CustomSkins.Common, is that not correct?

    What are "all relevant resources ... related to RadMap?" Is there documentation somewhere that I can refer to so I may ensure everything is ok on my side?

     

    Thanks,

  6. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 17 Jun Link to this post

    Hello,

    You can examine the Map.css or MapLite.css. At the beggining of the file you will see that a Telerik font is requested:
    @font-face {
      font-family: 'TelerikWebUI';
      src: url('<%=WebResource("Telerik.Web.UI.Skins.Common.TelerikWebUI.woff")%>') format("woff"), url('<%=WebResource("Telerik.Web.UI.Skins.Common.TelerikWebUI.ttf")%>') format("truetype");
      /* Safari, Android, iOS */
    }

    These fonts are required for the Map markers to render, so you need to make sure that the woff files and ttf files are included in the assembly and that they are requested as per to the new assembly's namespace.

    For these rules you can see how the glyph icons are rendered:
    .RadMap .k-marker:before,
    .RadMap .k-marker-Pin-target:before,
    .RadMap .k-marker-pin-target:before {
      content: "\E124";
    }
     
    .RadMap span.k-marker-Pin:before,
    .RadMap span.k-marker-pin:before {
      content: "\E125";
    }

    The map-marker.png is used only for cross-browser support, where glyph icons are not supported (e.g., IE8). 

    Regards,
    Ianko
    Telerik
  7. ww1711
    ww1711 avatar
    17 posts
    Member since:
    May 2012

    Posted 17 Jun in reply to Ianko Link to this post

    I can confirm that the references to the .woff and .ttf files are where they're supposed to be and the that the files are in the locations referenced. I have two Map.css files in my assembly; Map.css and Map.CustomName.css.

    Map.css is located at: Telerik.Web.UI.CustomSkins.Map.css whereas;

    Map.CustomName.css is located at: Telerik.Web.UI.CustomSkins.CustomName.Map.CustomName.css

    The two .css files are entirely different and the reference to the .woff and .ttf files are only made in the Map.css file while my solution is using the CustomName skin across the application:

    <add key="Telerik.Web.SkinsAssembly" value="Telerik.Web.UI.CustomSkins" />
    <add key="Telerik.Skin" value="CustomName" />

    Is this expected behavior?

     

    Thanks in advance!

  8. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 20 Jun Link to this post

    Hi,

    Map.css is the base file where all common styles are applied. Whereas Map.CustomName.css is the style relevant for the skin-specific decorations.

    Both files should be added to the page automatically when using a custom skin. 

    Can you prepare an example with the custom skin only for the map and a page utilizing that custom skin so that I can take a better look at the problem? If you are concerned about sharing this in a public thread consider opening an official support ticket.

    Regards,
    Ianko
    Telerik
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017