页面树结构

版本比较

标识

  • 该行被添加。
  • 该行被删除。
  • 格式已经改变。

...

自定义属性设置项可通过编写Echarts代码对图形的样式进行修改,左下方显示图形使用的版本,界面如下所示:

Image Modified

功能说明如下:

设置项说明
按钮示例生成参考示例,用户可参考示例编写自定义属性。
格式化调整Echarts代码的格式。
说明文档可前往Echarts官网查看Echarts配置项的使用文档。
页面图形配置用于配置用户自定义编写的扩展代码,支持注释,支持的注释格式:/*ABC*/、//ABC   
完整配置用于展示组件的完整属性代码,不允许修改。

...

添加自定义属性,使图形提示内容由销售量(合计):xxx变为数值:xxx元,效果如下图所示:

Image Modified

使用方法

(1)选中组件,点击组件设置,编辑自定义属性

...

代码块
"tooltip": {
"formatter": "function(a){return'发货区域:'+a.name+'</br>'+'数值:'+a.data.value[1]+'元'}"
}

Image Modified

方式二:使用函数

代码块
function test(a) {
 //返回标签内容
  return '发货区域:' + a.name + '</br>' + '数值:' + a.data.value[1] + '元'
}
option = {
  tooltip: {
     /*箭头函数*/
    formatter: (a) => {
      return test(a)
    }
  }
}

Image Modified

(3)点击确定,自定义属性效果生效,如下图所示:

Image Modified

关于Echarts的使用,可参考文档 Echarts基本使用方法