javascript - 替换 data-ui-options 属性的图表代码
问题描述
我是新手,我想知道如何将图表代码替换为属性 data-ui-options unsing JQUERY。
<div id="graficoHell" data-ui-jp="echarts" data-ui-options="{
xAxis: {
data: ['a', 'b', 'c', 'd'],
axisTick: {show: false},
axisLabel: {
formatter: 'barGap: \'-100%\''
}
},
yAxis: {
splitLine: {show: false}
},
animationDurationUpdate: 1200,
series: [{
type: 'bar',
itemStyle: {
normal: {
color: '#ddd'
}
},
silent: true,
barWidth: 40,
barGap: '-100%', // Make series be overlap
data: [60, 60, 60, 60]
}, {
type: 'bar',
barWidth: 40,
z: 10,
data: [4, 60, 13, 25]
}]
} " style="height:300px" >
我在 JavaScript 中尝试了与字符串相同的代码,但它不起作用。
$('#graficoHell').attr('data-ui-options', "same_string_into_data-ui-options");
我看到的所有例子,都是使用echarts对象,但是我买的模板是这样的。
解决方案
即使这是一个老问题,我还是可以回答它。您可以使用 element.dataset 函数来查询/更改 html 元素的数据。
根据文档查询数据:
<div id="user" data-id="1234567890" data-user="johndoe" data-date-of-birth>John Doe</div>
const el = document.querySelector('#user');
// el.id == 'user'
// el.dataset.id === '1234567890'
// el.dataset.user === 'johndoe'
// el.dataset.dateOfBirth === ''
更新数据:
const el = document.querySelector('#user');
el.dataset.dateOfBirth = '1960-10-03';
推荐阅读
- python - Kivy Widget Canvas 中相对大小的矩形
- ios - 使用的架构混乱
- javascript - 在基于 JavaScript 的面部标志检测中查找所有点的坐标
- javascript - 如何覆盖Angularjs中的组件
- html - 在 PC Chrome Inspect 视图中,一切都很完美,但在移动设备上却没有响应
- google-apps-script - 使用谷歌应用脚本复制/粘贴值
- postgresql - 使用 dart 将数据插入 Postgres 数据库
- python - Django on_delete = models.SET()
- windows - 检查是否安装了服务,如果是,则获取状态并生成报告 - 使用 Ansible
- c# - 一段时间后,信号 R 连接状态为 0