您好,
会员登录 快速注册
退出 ( 条未读消息)
关于本站 意见反馈 首页

公告:小宅博客网可以开发票了,需要发票的,去群里找群主哈!!
全部文章分类
  • 人工智能 >

  • 编程语言 >

  • WPF系列 >

  • ASP.NET系列 >

  • Linux >

  • 数据库 >

  • 嵌入式 >

  • WEB技术 >

  • PLC系列 >

  • 微服务与框架 >

  • 小宅DIY >

  • 学习资料 >

OpenCv基础 ANN车牌识别 yolov5车牌识别 指针式仪表识别 ROS系列 YOLO Halcon Detectron2 昇腾AI ChatGPT在线体验 英伟达JETSON ChatGLM ChatTTS FunASR 地平线 ByteTrack 魔搭社区 LangChain
C C# C++ Python Java Go
WPF
ASP.NET小功能 GPS定位系统-MVC GPS定位系统-VUE ASP.NET WebRTC
Linux Linux内核 Shell MakeFile
MySql SqlServer Oracle
STM8 STM32 51单片机
VUE入门 HTML JavaScript CSS layui镜像网站 ElementUi中文官网 element-plus 图标
三菱 欧姆龙 西门子 施耐德 松下 台达
IOTSharp IOTGateway ABP FRAMEWORK Docker
亚克力音响 编程仙途:智驭万法
面试题与技巧 Python入门技能树 微软C#教程
首页 编程之美 工具下载 全国就业 流量地图 文心一言
GPS定位系统-MVC
.NET6.0 GPS定位系统介绍(物联网) 系列源码下载 1、新建.net core web工程 2、添加自定义登录页面 3、添加百度地图页面 4、添加后台日志系统 5、添加mysql数据存储 6、添加SqlServer数据存储(额外内容) 7、用户注册与登录功能实现 8、添加坐标报表页面(用于遍历地图坐标) 9、前后端数据交互与报表数据展示 10、报表数据的编辑与修改 11、用户登录与退出 12、自定义GPRS通讯协议 13、添加TCP通讯功能(接收) 14、添加TCP通讯功能(发送) 15、模拟GPRS数据通讯 16、设备链接状态检测与提示 17、新建Windows Server虚拟机 18、服务器IIS运行环境配置 19、服务器.net程序发布 20、关于如何配置.net3.1框架 21、关于如何配置.net5.0框架 22、WinForm版地图上位机(带数据库和TCP功能) 23、WPF版地图上位机(带数据库和TCP功能) 24、公网映射与外网通讯 25、GPS协议与AT命令流程说明 26、GPRS协议与AT命令流程说明 27、STM32、A9G硬件连接图 28、STM32开发环境搭建 29、STM32 GPS/GPRS通讯功能实现 30、STM32 GPS定位数据上报服务器 31、室外最终效果演示 32、结束语
7、用户注册与登录功能实现
9、前后端数据交互与报表数据展示
激萌の小宅 小宅博客网 GPS定位系统-MVC

文章作者:激萌の小宅

促销:¥0

价格:¥0

配送方式: 购买后立即生效(如购买异常,请联系站长)
付款之后一定要等待自动跳转结束,否则购买可能会失败
  • 0 天

    有效期

  • 0

    总销量

  • 0

    累计评价

添加坐标报表页面(用于遍历地图坐标)- (第八讲)

视频讲解如下:


工程源码下载:GPS定位系统系列教程源码下载


        添加报表的目的主要是为了能够将用户上传的gps坐标能够以表格的形式进行展示,博主这里前端采用Datatables库来实现报表的翻页,数据量不大的情况下,还是挺好用的。

        我们的需求是:在home主页做个切换按钮,能够在地图和报表之间来回切换,当然啦,我们可以顺便加个退出按钮,用于退出到登录页,以及用于展示当前用户信息的展示框。这也是所有平台都应该具备的最基本的功能。

        我们的实现原理也很简单,就是在home主页中,采用iframe将地图和报表嵌入在home页面中,需要展示哪个页面时,我们就切换到哪个页面。


1、home页面演示

        和登录页面的嵌入方法一样,我们需要先在外部将html文件调试好,然后再移植到.net中,毕竟这种调试方法,开发起来比较快,如果直接在.net中调试,那么我们每次修改,都需要重新编译、运行,效率很低。

        我们直接采用之前调试好的地图demo进行修改。我们的文件如下:

微信截图_20220915154528.jpg

index.html是Home主页

map.html 是地图页面

tab.html 是我们的报表页面


运行效果如下:

home (1).gif


2、ASP.NET CORE中嵌入Home页面

            嵌入方法和嵌入登录页面的方法是一样的,我这样就不再重复演示了。对应的css、js、jpg图片等全部扔到对应的文件夹下,和登录页面的文件放在一起。同时我们将当前的“index.html”、“map.html”、“tab.html”三个文件都集成到Home目录下面。

            前端页面嵌入之后,我们还需要做几个修改,否则页面是加载不出来的,主页修改包括:

1、在控制器中添加对应页面的调用

public IActionResult tab()
{
    return View();
}
public IActionResult map()
{
    return View();
}

2、将tab.cshtml和map.cshtml页面中css和js的调用改成绝对路径

微信截图_20220915172915.jpg

3、Index.cshtml中,ToUrl参数去掉后缀,同时加上“Home/”前缀。

QQ截图20220915172939.jpg

按这样修改完成之后,我启动程序,登录之后,我们就可以进入主页面,并进行两个页面的切换了。


7、用户注册与登录功能实现
9、前后端数据交互与报表数据展示

友情链接: CSDN激萌の小宅 95知识库 自考题库 罗分明个人网络博客 精益编程leanboot

小宅博客  www.bilibili996.com All Rights Reserved. 备案号: 闽ICP备2024034575号

网站经营许可证  福建省福州市 Copyright©2021-2025 版权所有

小宅博客
首页 智能家居 地图定位
公告:小宅博客网可以开发票了,需要发票的,去群里找群主哈!!

文章作者:激萌の小宅

促销:¥0

价格:¥0

配送方式: 购买后立即生效(如购买异常,请联系站长)
付款之后一定要等待自动跳转结束,否则购买可能会失败
  • 0 天

    有效期

  • 0

    总销量

  • 0

    累计评价

添加坐标报表页面(用于遍历地图坐标)- (第八讲)

视频讲解如下:


工程源码下载:GPS定位系统系列教程源码下载


        添加报表的目的主要是为了能够将用户上传的gps坐标能够以表格的形式进行展示,博主这里前端采用Datatables库来实现报表的翻页,数据量不大的情况下,还是挺好用的。

        我们的需求是:在home主页做个切换按钮,能够在地图和报表之间来回切换,当然啦,我们可以顺便加个退出按钮,用于退出到登录页,以及用于展示当前用户信息的展示框。这也是所有平台都应该具备的最基本的功能。

        我们的实现原理也很简单,就是在home主页中,采用iframe将地图和报表嵌入在home页面中,需要展示哪个页面时,我们就切换到哪个页面。


1、home页面演示

        和登录页面的嵌入方法一样,我们需要先在外部将html文件调试好,然后再移植到.net中,毕竟这种调试方法,开发起来比较快,如果直接在.net中调试,那么我们每次修改,都需要重新编译、运行,效率很低。

        我们直接采用之前调试好的地图demo进行修改。我们的文件如下:

微信截图_20220915154528.jpg

index.html是Home主页

map.html 是地图页面

tab.html 是我们的报表页面


运行效果如下:

home (1).gif


2、ASP.NET CORE中嵌入Home页面

            嵌入方法和嵌入登录页面的方法是一样的,我这样就不再重复演示了。对应的css、js、jpg图片等全部扔到对应的文件夹下,和登录页面的文件放在一起。同时我们将当前的“index.html”、“map.html”、“tab.html”三个文件都集成到Home目录下面。

            前端页面嵌入之后,我们还需要做几个修改,否则页面是加载不出来的,主页修改包括:

1、在控制器中添加对应页面的调用

public IActionResult tab()
{
    return View();
}
public IActionResult map()
{
    return View();
}

2、将tab.cshtml和map.cshtml页面中css和js的调用改成绝对路径

微信截图_20220915172915.jpg

3、Index.cshtml中,ToUrl参数去掉后缀,同时加上“Home/”前缀。

QQ截图20220915172939.jpg

按这样修改完成之后,我启动程序,登录之后,我们就可以进入主页面,并进行两个页面的切换了。