要创建拖放效果的 Apache Echarts 图表,可以按照以下步骤进行:
// 初始化图表
var chart = echarts.init(document.getElementById('chart'));
// 定义图表配置项
var option = {
title: {
text: 'Apache Echarts - 创建拖放效果'
},
tooltip: {},
legend: {
data: ['销量']
},
xAxis: {
data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
},
yAxis: {},
series: [{
name: '销量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}]
};
// 设置拖拽效果
chart.on('dragstart', function (params) {
console.log(params);
});
chart.on('dragend', function (params) {
console.log(params);
});
// 渲染图表
chart.setOption(option);
以上代码将创建一个柱状图,你可以在拖拽柱形图时触发 dragstart
和 dragend
事件,并在控制台中打印出相关参数。
注意:在上述代码中,我们使用了 Echarts 的基本配置,你可以根据自己的需求进行修改和调整。