Telerik UI TreeMap in RazorPages

RazorPage is an alternative to the MVC pattern that makes page-focused coding easier and more productive. It consists of a cshtml file and a cs file (generally the two files have the same name). The Telerik UI TreeMap for ASP.NET Core can be integrated in such an application seamlessly.

For a runnable example, refer to the TreeMap in RazorPages example.

Getting Started

To bind the Telerik UI TreeMap to a data set within a RazorPage:

1. Setup the Read URL in the DataSource. The URL should refer the name of the method in the PageModel. And the Model should contain the definition for Children:

     .DataSource(dataSource => dataSource
         .Read(r => r.Url("/TreeMap/TreeMapBinding?handler=ReadOptional"))
         .Model(m => m.Children("Items"))
     )
   

   <hierarchical-datasource>
           <transport>
               <read url="/TreeMap/TreeMapBinding?handler=ReadOptional" />
           </transport>
           <schema>
               <hierarchical-model children="items"></hierarchical-model>
           </schema>
       </hierarchical-datasource>
   

2. Within the .cs file, introduce an ActionMethod to return the data set:

       public JsonResult OnGetReadOptional()
       {
           return new JsonResult(TreeMapItems);
       }
   

See Also

• Server-Side API