网站系统搭建,网站建设数据表设计 性别,wordpress数据库无法连接,做网站后台搭建都用什么需求一#xff1a; y轴数据处理不同数据增加不同单位 需求二#xff1a; 自定义图表悬浮显示的内容 需求一#xff1a;实现方式 在yAxis里面添加formatter yAxis: [{//y轴显示value的设置axisLabel: {show: true,formatter (value, index) {var valueif (value 1… 需求一 y轴数据处理不同数据增加不同单位 需求二 自定义图表悬浮显示的内容 需求一实现方式 在yAxis里面添加formatter yAxis: [{//y轴显示value的设置axisLabel: {show: true,formatter (value, index) {var valueif (value 1000 value 10000) {value value / 1000 k} else if (value 10000) {value value / 10000 w} else if (value 1000) {value value},},return valuecolor: rgba(0,0,0,0.3),fontSize: 12},}]问题 formatter 设置未生效 h5可以正常展示能看到单位但是app端不生效 app端不生效是因为
在app端回调函数无法从renderjs外传递上面的设置使用了回调函数所以app端不生效。
但是需求功能要使用回调函数才能实现。
查看Echarts组件的代码发现里面有这样一段代码 所以只需要在函数update(option) {}里面自定义设置相关回调函数即可。
下面是我最终的实现代码 然后跟update同级添加以下方法此方法为上方update里面调用 在回到调用echarts页面 重新更改下方法 yAxis: [{//y轴显示value的设置axisLabel: {show: true,formatterFunction: (value, index) {var valueif (value 1000 value 10000) {value value / 1000 k} else if (value 10000) {value value / 10000 w} else if (value 1000) {value value}return value},return valuecolor: rgba(0,0,0,0.3),fontSize: 12},}]这时app端已经可以成功显示了 那需求二就是在此基础上实现可以渲染html代码就可以了
需求二实现方式 在yAxis里面添加formatter
对tooltip进行formatter相关的设置 tooltip: {trigger: axis, // axis显示该列下所有坐标轴对应数据item只显示该点数据formatterFunction: (params){console.log(params) //可以先输出看下都有什么内容 // str里面的代码只是部分代码 只演示怎么在这里面写html实现想要的内容样式let str span params[1].name /span/brspan 合计 /span span params[1].value/spanreturn str; },axisPointer: {type: shadow // 默认为直线可选为line | shadow}
},
