乐趣区

关于低代码:搭建实战全国天气预报看板搭建

码匠是什么?

码匠是一款国内研发的开发者敌对的低代码平台,您无需理解 React/Vue 等框架的开发、部署等各种细节,就能够疾速买通前后端,连贯 REST API、MySQL、MongoDB 等多种数据源,而后通过一套开箱即用的组件,轻松搭建功能完善的数据看板、数据洞察、Admin 治理后盾等多种利用。
码匠次要面向国内用户,相较于国外开发的 Admin/CRM/CMS 等后盾工具,码匠的 UI 界面设计更加适宜国内业务场景。同时码匠整合了多款国内常见数据源,包含飞书、企业微信、钉钉、阿里云 OSS 等。不仅如此,码匠还一站式提供了企业外部零碎罕用的租户治理、细粒度的权限管制、审计日志等性能,让您疾速搭建后盾利用的同时,也为您的企业信息安全保驾护航。

应用码匠搭建全国天气预报数据看板

天气预报是对将来肯定期间内天气变动的当时预计和预报,是气象工作为国民经济和国防建设服务的重要伎俩。咱们简直每天都会关注天气预报,能够提前晓得将来的天气,免得天气凛冽没有添衣保暖。天气预报对咱们的各项流动有很大的帮忙,能够让咱们合理安排本人的出行等流动。
本篇文章码匠将带您疾速搭建出一个天气预报数据看板,前两篇的【how to 系列】让您的工作变得更有效率,那么这一篇,码匠心愿可能不便您的生存出行。

一、梳理需要

一个天气预报数据看板可能须要以下性能:
1. 抉择指标地区: 在「📍抉择地区」处下拉选项,让使用者能够抉择不同的地区进行当地天气预报的查问

2. 查看实时天气预报 :抉择想查问的地区后,需提供一系列当地的实时天气预报,直观简洁的显示出气象信息,包含温度、风向风力、空气湿度、紫外线强度、气压以及 24 小时气温变动状况等。

3. 显示将来天气状况: 在显示页上不仅可能看到实时天气播报,还须要显示将来 4 天的天气状况。具体包含白天和晚间天气情况、当日最高最低气温以及风力风向。

4. 天气 API 的抉择:API 方面,这里抉择了国内最出名的高德天气 API:https://lbs.amap.com/api/webs…,对于个人账户,高德提供每日收费的 5000 次查问限额,数据方面则提供了气温、风向、湿度等多类数据。

二、开始搭建

在本例搭建中次要用到了下述组件:

  • 文本(Text)
  • 级联选择器 (Cascader)
  • 表格(Table)
  • 容器(Container)
  • 自定义组件 (Custom Component)
  • 图表 (Chart)

步骤:

1. 依据须要拖拽右侧组件搭出利用框架,本例中码匠布局如下图,读者也能够依据好看和性能本人设计。

💡 码匠应用小技巧:
在画布中拖拽组件时,其余组件的边框和排布会一并显示进去,利用开发者能够利用该线条对齐组件、合理布局。

2. 批改组件的属性值填充细节,这里码匠批改了组件名称和一些组件外观上的设置,例如组件中文字的地位和对齐形式等。

💡 码匠应用小技巧:
适合的组件名能让利用后续的批改更不便,左侧的数据浏览面板也能帮忙您疾速定位组件。

3. 抉择适合的数据源进行设置:码匠将常见的几款数据库类型及 API 帮忙开发者配置实现,开发者只需抉择想要接入的数据类型,简略填写表单即可实现配置。

4. 创立查问并将查问后果和组件进行数据绑定,例如:下图中的级联选择器配置了中国省市直辖市的区号信息,查问中调用高德天气 API 接口并传入具体区号,这样就失去了该地区相干天气数据。

💡 码匠搭建利用罕用步骤:

  1. 疾速连贯数据源 & 创立查问
  2. 确定组件布局并拖放组件,应用 JavaScript 表达式绑定数据
  3. 设置查问和组件的事件触发,提供响应式 UI 交互

5. 利用至此就已搭建实现了,用户能够在右上角点击预览查看利用或点击权限邀请别人一起查看、编辑,还能够点击「···」抉择公布或导出。下图展现了权限治理相干界面:

💡 码匠应用小技巧:
善用历史记录性能能够缩小许多不必要的麻烦,在多人合作批改利用时尤为重要。

更多码匠模板参考及应用技巧

想要理解更多还请移步码匠官网(https://majiang.co/),码匠官网为您提供了海量的工作模板,能够服务于自媒体、风险投资、征询、广告业、零售业、医疗等团队,您都能够收费选用。除此之外,若您在应用过程中遇到了问题也能够随时查看帮忙文档或向客服寻求帮忙。最初欢送大家摸索码匠~

退出移动版