F2 vi tín tiểu trình tự

F2 đích vi tín tiểu trình tự bản bổn, chi trì nguyên sinhF2Đích sở hữu công năng, hoan nghênh sử dụng phản quỹ.

Khoái tốc thể nghiệm

• Vi tín tảo mã thể nghiệm

• Sử dụng vi tín khai phát giả công cụ đả khai thử hạng

Thuyết minh

Vi liễu phương tiện sử dụng, ngã môn phong trang liễu vi tín tiểu trình tự đích tự định nghĩa tổ kiện, cố nhu yếu vi tín tiểu trình tự chi trì sử dụng npm an trang đệ tam bao.
Trọng yếu: Bản bổn yếu cầu

1. Tiểu trình tự cơ sở khố bản bổn 2.7.0 hoặc dĩ thượng
2. Khai phát giả công cụ 1.02.1808300 hoặc dĩ thượng khai thủy, tiểu trình tự chi trì sử dụng npm an trang đệ tam phương bao.

Như hà sử dụng

1. An trang y lại

Hạng mục mặc nhận sơ thủy hóa xuất lai đích thị một hữupackage.jsonĐích, nhu yếu tân tăngpackage.jsonHậu tái an trang

## một hữu package.json thời chấp hành hạ diện giá đoạn
## echo "{}" > package.json

npm install @antv/wx-f2 --save

An trang hảo y lại bao chi hậu, điểm kích công cụ đỉnh bộ thái đan lan đích tường tình:

Câu tuyển “Sử dụng npm mô khối” tuyển hạng:

Tối hậu điểm kích khai phát giả công cụ trung đích thái đan lan: Công cụ --> cấu kiến npm tức khả vận hành.

Như quả bính đáo@babel/runtime vị trảo đáo npm bao nhập khẩu văn kiện,Trực tiếp hốt lược tựu hành liễu, bất ảnh hưởng sử dụng ( cường bách chứng ngại nhãn đích thoại, thủ động san trừnode_modules/@babel/runtimeMục lục )

rm -rf node_modules/@babel/runtime

2. Sử dụng tự định nghĩa tổ kiện

1. Đả khai json văn kiện, dẫn nhập tổ kiện

{
"usingComponents":{
"f2":"@antv/wx-f2"
}
}

2. wxml sử dụng tổ kiện

<viewclass="container">
<f2class="f2-chart"onInit="{{onInitChart}}"/>
</view>

3. wxss thiết trí khoan cao

.f2-chart{
width:100%;
height:500rpx;
}

4. Thật lệ hóa đồ biểu

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();
// chú ý: Nhu yếu bả chart return xuất lai
returnchart;
}
},
});

API

• F2 API tham kiến:https://f2.antv.vision/zh/docs/api/f2

Như hà cống hiến

Như quả nâm tại sử dụng đích quá trình trung bính đáo vấn đề, khả dĩ tiên thông quáissuesKhán khán hữu một hữu loại tự đích bug hoặc giả kiến nghị.

License

MIT license