taro-f2
taro-f2 copied to clipboard
chart.interaction('pan'),设置了无法平移
import Taro, { Component, Config } from '@tarojs/taro';
import { View } from '@tarojs/components';
import data from '../../data/sroll-line.js';
import { F2Canvas } from 'taro-f2';
const F2 = require('@antv/f2/lib/core'); // 必须引入
require('@antv/f2/lib/geom/interval'); // 引入 interval 几何标记
require('@antv/f2/lib/coord/polar'); // 引入 极坐标
require('@antv/f2/lib/geom/adjust/stack'); // 引入数据层叠调整类型
require('@antv/f2/lib/interaction/');
const ScrollBar = require('@antv/f2/lib/plugin/scroll-bar');
const Tooltip = require('@antv/f2/lib/plugin/tooltip');
F2.Chart.plugins.register([ScrollBar, Tooltip]);
export default class Index extends Component {
config = {
navigationBarTitleText: '线图平移交互(长按展示 tooltip)',
disableScroll: true,
};
state = {};
initChart(canvas, width, height) {
try {
// F2Canvas.fixF2(F2);
} catch (error) {
console.log('TCL: Index -> initChart -> error', error);
}
const chart = new F2.Chart({
el: canvas,
width,
height,
animate: false,
});
chart.source(data, {
release: {
min: 1990,
max: 2010,
},
});
chart.tooltip({
showCrosshairs: true,
showItemMarker: false,
background: {
radius: 2,
fill: '#1890FF',
padding: [3, 5],
},
nameStyle: {
fill: '#fff',
},
onShow(ev) {
const items = ev.items;
items[0].name = items[0].title;
},
});
chart.line().position('release*count');
chart
.point()
.position('release*count')
.style({
lineWidth: 1,
stroke: '#fff',
});
chart.interaction('pan', {
mode: 'x',
onEnd(a) {
console.log('onEnd', a);
},
onStart(a) {
console.log('onStart', a);
},
});
chart.interaction('swipe', {
speed: 15,
});
// 定义进度条
chart.scrollBar({
mode: 'x',
xStyle: {
offsetY: -5,
},
});
// 绘制 tag
chart.guide().tag({
position: [1969, 1344],
withPoint: false,
content: '1,344',
limitInPlot: true,
offsetX: 5,
direct: 'cr',
});
chart.render();
return chart;
}
render() {
console.log('FFFF', F2);
return (
<View style={{ height: '100%', width: '100%' }}>
<F2Canvas onCanvasInit={this.initChart.bind(this)}></F2Canvas>
</View>
);
}
}
代码是参考你的 scroll-line目录代码,
版本信息:Taro v1.3.18