扁平化企业网源码win8风格精简化源码asp带后台企业网站,兴趣电商平台有哪些,医药网站开发,小程序项目描述怎么写最近在做一个全国海域潮汐表查询#xff0c;可以为赶海钓鱼爱好者提供涨潮退潮时间表及潮高信息。 下面教大家怎么做一个这样的小程序。 主要功能#xff0c;根据IP定位地理位置#xff0c;自动查询出省份或城市的港口#xff0c;进入后预测7天内港口潮汐表查询。 步骤可以为赶海钓鱼爱好者提供涨潮退潮时间表及潮高信息。 下面教大家怎么做一个这样的小程序。 主要功能根据IP定位地理位置自动查询出省份或城市的港口进入后预测7天内港口潮汐表查询。 步骤 1.采集全部国海域港口数据。 2.采集对应的港口数据每天潮汐表数据。 3.用百度echarts.js图表显示潮汐信息。
有兴趣做小程序流量主的朋友可以扫码看效果 小程序截图 小程序代码
!--pages/index/index.wxml--
t-navbar classcustom-navbar title爱潮汐表网 /view style{{navBarHeight}}/viewview classlocation-boxt-icon namelocation size36rpx classlocation/ view classmycity当前定位城市{{location}}/view
/view
scroll-view scroll-ytrue scroll-into-view{{toView}} view classprovince-list id{{item.pinyin}} wx:for{{list}} wx:keyitem wx:for-itemitem view classprovince{{item.province}}/view view classport-list view classport-name wx:for{{item.port}} wx:for-itemv wx:keyid wx:for-indexindex data-id{{v.id}} bindtapgoPort {{v.city}} - {{v.port_name}}/view /view /view
/scroll-view view classindex-box view classprovince {{toViewitem.pinyin ? current: }} wx:for{{indexList}} wx:for-itemitem wx:keyindex bindtapchoiceProvince data-index{{item.pinyin}} {{item.name}} /view
/view 潮汐图表页面代码
!--pages/port/port.wxml--navigation defaultSetting{{navigationSetting}}/navigationt-tabs classbigger themetag space-evenly{{false}} value{{tab_day}} bind:clickonTabsChanget-tab-panel wx:for{{day_list}} wx:keydate wx:for-indexidx wx:for-itemitem label{{item.date}} value{{item.day}} /
/t-tabsview styleheight: 36px /view classpage-title
{{day}}
block wx:ifday_name{{day_name}}/blockview classstrong{{port.port_name}}/view潮汐表/view
view classpage-desc
当前潮高: view classtide-now{{tide.now_tide.tide}}cm /view
全天最高: view classtide-max{{tide.min_max_tide.max_tide.tide}}cm /view({{tide.min_max_tide.max_tide.time}})
最低:view classtide-min{{tide.min_max_tide.min_tide.tide}}cm/view({{tide.min_max_tide.min_tide.time}})
/viewview classtide-boxview classcontainerec-canvas idmychart-dom-line type2d canvas-idmychart-line ec{{ ec }}/ec-canvas/view
/viewview classpage-desc潮高基准面在平均海平面下 {{port.tide_datum}} CM
/viewview classblock port-listt-tag wx:for{{ports}} wx:keyid wx:for-indexid wx:for-itemitem classmargin-16 port-name variantoutline themeprimary bind:clicktagClick data-id{{item.id}}{{item.port_name}}潮汐表/t-tag
/view
