组件/图表

新为Blazor的Telerik UI?下载30天免费试用

渲染模式

Blazor的图表支持两种呈现数据的模式。方法设置所需的呈现模式RenderAs参数的TelerikChart暴露。它需要一个元素Telerik.Blazor.RenderingMode枚举，根据您试图获得的结果，您可以选择以下选项之一:

SVG

图表的默认呈现模式是SVG(可缩放矢量图形)，建议一般使用。

使用矢量图形可以确保:

  • 浏览器缩放不会降低图像。
  • 不管分辨率如何，照片都很清晰。

自SVG是图表的默认呈现模式，不需要显式定义它。

柱状图呈现为SVG。

@* SVG柱状图*@               @code {public List series1Data = new List() {10,2,5,6};public List series2Data = new List() {5,8,2,7};public string[] xAxisItems = new string[] {"Q1"， "Q2"， "Q3"， "Q4"};｝
         
帆布

         
当性能非常关键时(例如渲染大型仪表板和频繁更新的图表时)，建议使用Canvas(位图)。

         
浏览器不需要为图表维护一个活动的DOM树，结果是:

         
    
          
  • 更快的屏幕更新。
    • 
          
  • 降低内存使用率。
    • 
         

         
缺点是，渲染到一个固定分辨率的位图会导致:

         
    
          
  • 放大时图像模糊。
    • 
          
  • 印刷质量较差。
    • 
         

         

          
条形图渲染为画布。

         

         
@* Canvas条形图*@               @code { public List series1Data = new List() { 10, 2, 5, 6 }; public List series2Data = new List() { 5, 8, 2, 7 }; public string[] xAxisItems = new string[] { "Q1", "Q2", "Q3", "Q4" }; }
         
另请参阅

         
        
       
      
      
     
     

      

       

        在本文中

       
      

      
      

       

        相关文章

       
      

      
      

       找不到你需要的帮助?
       
       
        
        
        
         
         
          
         
        改进本文
      

     

    
   
   

   
  
  
  
  
  
  
 
Baidu