至于引用echarts的东西就要通过定义的myChart去引用,具体要了解echarts的属性方法和事件,可参考echarts.js文件。
以下是引用吹水佬在2021-11-8 11:52:08的发言:
其实就是HTML、JavaScript和CSS方面的编程,写个HTML文件用IE控件加载展现。
要鼠标点击事件,可以在需要的地方写个onclick事件函数就可以。
如:画布点击事件
在 <div class="echarts_canvas" id="main"></div> 添加一项 onclick=canvas_click()
<div class="echarts_canvas" id="main" onclick=canvas_click()></div>
在 <script> 添加一个canvas_click()函数
function canvas_click() {
alert(123456);
}
<body>
<div class="echarts_canvas" id="main" onclick=canvas_click()></div>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'));
var option = {
title : {text:"ECharts 入门示例"},
tooltip : {},
legend : {data:["<<ALLTRIM(tt.名称)>>"]},
xAxis : {data:["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]},
yAxis : {},
series : [{name:"<<ALLTRIM(tt.名称)>>",type:"bar",data:[<<tt.衬衫>>,<<tt.羊毛衫>>,<<tt.雪纺衫>>,<<tt.裤子>>,<<tt.高跟鞋>>,<<tt.袜子>>]}],
//设置中间内容距离div的距离,也就是内边距
grid : {top:40, left:30, right:30, width:"auto", height:"auto"},
};
myChart.setOption(option);
window.onresize = function () {
myChart.resize(); //自动调整canvas的大小
}
function canvas_click() {
alert(123456);
}
</script>
</body>
其实就是HTML、JavaScript和CSS方面的编程,写个HTML文件用IE控件加载展现。
要鼠标点击事件,可以在需要的地方写个onclick事件函数就可以。
如:画布点击事件
在 <div class="echarts_canvas" id="main"></div> 添加一项 onclick=canvas_click()
<div class="echarts_canvas" id="main" onclick=canvas_click()></div>
在 <script> 添加一个canvas_click()函数
function canvas_click() {
alert(123456);
}
<body>
<div class="echarts_canvas" id="main" onclick=canvas_click()></div>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'));
var option = {
title : {text:"ECharts 入门示例"},
tooltip : {},
legend : {data:["<<ALLTRIM(tt.名称)>>"]},
xAxis : {data:["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]},
yAxis : {},
series : [{name:"<<ALLTRIM(tt.名称)>>",type:"bar",data:[<<tt.衬衫>>,<<tt.羊毛衫>>,<<tt.雪纺衫>>,<<tt.裤子>>,<<tt.高跟鞋>>,<<tt.袜子>>]}],
//设置中间内容距离div的距离,也就是内边距
grid : {top:40, left:30, right:30, width:"auto", height:"auto"},
};
myChart.setOption(option);
window.onresize = function () {
myChart.resize(); //自动调整canvas的大小
}
function canvas_click() {
alert(123456);
}
</script>
</body>
感谢吹版回答,这是一种方法,但不是想要的那种;
在教学示例中https://echarts. ,柱状图标题的小色块可以点击,见图: