毫不费力地填充了带有MongoDB服务器数据的外汇枢轴表:综合指南
#网络开发人员 #mongodb #data #blazor

MongoDB是一个流行的NOSQL数据库系统。开发人员和组织使用它来存储和管理大量数据。使用MongoDB的优点之一是它水平扩展的能力,使其非常适合需要高可用性和可伸缩性的应用。在此博客中,我们将讨论如何使用MongoDB Atlas创建MongoDB数据库,并使用MongoDB服务器的数据填充Blazor Pivot Table

首先,我们使用 mongodb atlas

创建一个mongoDB数据库

步骤1:创建一个MongoDB Atlas帐户

MongoDB Atlas 是一项基于云的服务,提供了完全管理的MongoDB数据库。首先,访问MongoDB Atlas网站和create an account

Create a MongoDB Atlas account

创建一个mongodb atlas帐户

步骤2:创建一个mongoDB群集

创建帐户后,建立一个新的mongoDB群集。转到MongoDB Atlas仪表板上的 Deployment->数据库,然后选择构建数据库按钮。选择满足您要求的群集配置,然后单击创建

Deploy a database cluster by selecting the Build a Database button

通过选择构建数据库按钮

来部署数据库群集

Selecting a cluster configuration

选择群集配置

步骤3:通过身份验证协议确保您的连接

在创建数据库群集时,您将被定向到安全QuickStart 页面,您需要在其中进行身份验证以进行安全访问。输入您的用户名密码,选择创建用户

Adding authentication to the database cluster to create a secure link

在数据库群集中添加身份验证以创建安全链接

接下来,输入IP地址以访问数据库群集。仅添加到访问列表中的IP地址才能连接到您的大型应用程序中的数据库。最后,选择完成并关闭。您的群集现在可以添加数据收集。

Adding IP addresses to the Access List

将IP地址添加到访问列表

步骤4:创建数据库和收集

设置群集后,创建一个新的数据库和集合。转到MongoDB Atlas仪表板上的浏览收集选项卡,然后单击添加我自己的数据。输入您的数据库和收集名称,然后选择创建

Creating a new database and collection

创建一个新的数据库和收集

步骤5:将数据添加到集合中

要将数据添加到您的集合中,请转到 Collection 选项卡,然后选择插入文档。输入要添加的数据,然后单击插入。您的数据现在准备好绑定到您的大火枢轴表。

Insert ProductDetails data into the dialog UI

将productDetail插入到对话框UI

ProductDetails collection added to the Syncfusion-DB database

添加到SyncFusion-DB数据库

的productDetails集合

步骤6:连接您的MongoDB群集

连接包含数据的数据库。为此,请转到MongoDB Atlas仪表板,然后选择概述,然后是 Connect 。要创建连接字符串,您必须选择其中一种通信方法。在这种情况下,我们选择使用mongoDB指南针。现在,您可以将以下连接字符串复制并粘贴到您的Ellazor应用程序代码中以检索数据并将其绑定到Pivot表中。

Connection string created using MongoDB Compass

使用mongodb指南针创建的连接字符串

步骤7:从Ellazor连接到MongoDB服务器

要连接到MongoDB服务器,请创建一个Glazor应用程序。您需要使用该应用程序中的Nuget软件包管理器安装 mongodb.driver 软件包。

Installing MongoDB.Driver using the NuGet Package Manager

使用Nuget Package Manager

安装mongodb.driver

安装了软件包后,使用连接字符串使用 mongoclient 类连接到MongoDB服务器,并将检索到的数据绑定到jullazor Pivot表,如下代码所示。<

@using Syncfusion.Blazor.PivotView
@using MongoDB.Bson;
@using MongoDB.Driver;
@using MongoDB.Driver.Core.Authentication;

<SfPivotView TValue="ProductDetails" Width="1000" Height="300" ShowFieldList="true">
    <PivotViewDataSourceSettings TValue="ProductDetails" DataSource="@dataSource" ExpandAll=false EnableSorting=true>
        <PivotViewColumns>
            <PivotViewColumn Name="Year"></PivotViewColumn>                    
        </PivotViewColumns>
        <PivotViewRows>
            <PivotViewRow Name="Country"></PivotViewRow>
            <PivotViewRow Name="Products"></PivotViewRow>
        </PivotViewRows>
        <PivotViewValues>
            <PivotViewValue Name="Sold" Caption="Units Sold"></PivotViewValue>
            <PivotViewValue Name="Amount" Caption="Sold Amount"></PivotViewValue>
        </PivotViewValues>
        <PivotViewFormatSettings>
            <PivotViewFormatSetting Name="Sold" Format="N2"></PivotViewFormatSetting>
            <PivotViewFormatSetting Name="Amount" Format="C"></PivotViewFormatSetting>
        </PivotViewFormatSettings>
    </PivotViewDataSourceSettings>
    <PivotViewGridSettings ColumnWidth="120"></PivotViewGridSettings>
</SfPivotView>

@code {
    private List<ProductDetails> dataSource { get; set; }

    protected override void OnInitialized()
    {
        string connectionString = @"mongodb+srv://Syncfusion1:<password>@cluster0.7hzev56.mongodb.net/test";
        MongoClient client = new MongoClient(connectionString);
        IMongoDatabase database = client.GetDatabase("sample_training");
        IMongoCollection<ProductDetails> collection = database.GetCollection<ProductDetails>("ProductDetails");
        dataSource = collection.Find(new BsonDocument()).ToList();      
    }

    public class ProductDetails
    {  
        public ObjectId _id { get; set; }
        public int Sold { get; set; }
        public double Amount { get; set; }
        public string Country { get; set; }
        public string Products { get; set; }
        public string Year { get; set; }
        public string Quarter { get; set; }
    }
}

遵循文档link,以了解有关使用Syncfusion Blazor Pivot表构建简单的大型应用程序的更多信息,以从您的MongoDB提取和绑定数据。

github上的示例项目

有关更多详细信息,请参阅此GitHub location中的示例应用程序。

推荐链接

结论

感谢您抽出宝贵的时间阅读此博客文章,我们在其中讨论了如何使用MongoDB地图集创建MongoDB数据库,并使用可用工具和功能使用数据填充Blazor Pivot Table。遵循本文中概述的步骤,该步骤使创建功能强大的Web应用程序变得容易,该应用程序允许用户视觉分析和汇总数据。

如果您是现有客户,则可以从License and Downloads页面下载新版本。如果您不是一个综合客户的客户,我们邀请您尝试我们30天的free trial来体验我们所有可用的功能。此外,您可以在此GitHub位置探索我们的样品。

我们欢迎您可能获得的任何反馈,因此请随时在下面的评论部分分享您的想法,或通过我们的support forumsupport portalfeedback portal与我们联系。我们总是在这里为您提供帮助!

相关博客