- Notifications
You must be signed in to change notification settings - Fork186
antvis/wx-f2
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
F2 的微信小程序版本，支持原生F2 的所有功能，欢迎使用反馈。
- 微信扫码体验
- 使用微信开发者工具打开此项
为了方便使用，我们封装了微信小程序的自定义组件，故需要微信小程序支持使用 npm 安装第三包。
重要：版本要求
- 小程序基础库版本 2.7.0 或以上
- 开发者工具 1.02.1808300 或以上开始，小程序支持使用 npm 安装第三方包。
项目默认初始化出来的是没有package.json的，需要新增package.json后再安装
## 没有package.json时执行下面这段## echo "{}" > package.jsonnpm install @antv/wx-f2 --save
安装好依赖包之后，点击工具顶部菜单栏的详情：
勾选“使用 npm 模块”选项：
最后点击开发者工具中的菜单栏：工具 --> 构建 npm 即可运行。
如果碰到@babel/runtime 未找到npm包入口文件，直接忽略就行了，不影响使用（强迫症碍眼的话，手动删除node_modules/@babel/runtime目录）
rm -rf node_modules/@babel/runtime
{"usingComponents": {"f2":"@antv/wx-f2" }}<viewclass="container"> <f2class="f2-chart"onInit="{{onInitChart}}" /></view>
.f2-chart {width:100%;height:500rpx;}
Page({data:{onInitChart(F2,config){constchart=newF2.Chart(config);constdata=[{value:63.4,city:'New York',date:'2011-10-01'},{value:62.7,city:'Alaska',date:'2011-10-01'},{value:72.2,city:'Austin',date:'2011-10-01'},{value:58,city:'New York',date:'2011-10-02'},{value:59.9,city:'Alaska',date:'2011-10-02'},{value:67.7,city:'Austin',date:'2011-10-02'},{value:53.3,city:'New York',date:'2011-10-03'},{value:59.1,city:'Alaska',date:'2011-10-03'},{value:69.4,city:'Austin',date:'2011-10-03'},];chart.source(data,{date:{range:[0,1],type:'timeCat',mask:'MM-DD'},value:{max:300,tickCount:4}});chart.area().position('date*value').color('city').adjust('stack');chart.line().position('date*value').color('city').adjust('stack');chart.render();// 注意：需要把chart return 出来returnchart;}},});
- F2 API 参见：https://f2.antv.vision/zh/docs/api/f2
如果您在使用的过程中碰到问题，可以先通过issues 看看有没有类似的 bug 或者建议。