input的内容传递给echarts
时间: 2023-10-27 08:14:27 浏览: 95
捕获input文本框内容改变事件的js代码
5星 · 资源好评率100%
要将input的内容传递给echarts,您可以使用JavaScript编写脚本将input的值捕获并将其传递给echarts。下面是一个简单的示例:
HTML代码:
```
<input type="text" id="inputValue" placeholder="请输入值">
<div id="myChart" style="width: 600px;height:400px;"></div>
```
JavaScript代码:
```
// 获取输入框的值
var inputValue = document.getElementById("inputValue").value;
// 初始化echarts图表
var myChart = echarts.init(document.getElementById('myChart'));
// 设置图表的配置项和数据
var option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
data: [inputValue, 20, 36, 10, 10, 20, 30],
type: 'bar'
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
```
在这个例子中,我们获取了输入框的值,并将其用作echarts图表中第一个数据点的值。您可以根据自己的需求修改代码,以实现您想要的功能。
阅读全文