关于前端:EchartsdataZoom的自定义样式配置

最终成果:

代码:

const dataZoomStyle = {  // 文字款式  textStyle: {    color: fontColor  },  // 背景色  backgroundColor: dataZoomBgColor,  // 是否开启刷选性能  brushSelect: false,  // 选中范畴的填充色彩  fillerColor: dataZoomSliderColor,  // datazoom的边框色彩  borderColor: 'rgba(0, 0, 0, 0)',  handleIcon: 'M0,0 v9.7h5 v-9.7h-5 Z', /* 手柄的形态    M = moveto    L = lineto    H = horizontal lineto    V = vertical lineto    C = curveto    S = smooth curveto    Q = quadratic Belzier curve    T = smooth quadratic Belzier curveto    A = elliptical Arc    Z = closepath    以上所有命令均容许小写字母。大写示意相对定位，小写示意绝对定位。  * */  // 手柄的款式  handleStyle: {    color: dataZoomHandleColor,    borderColor: dataZoomHandleColor  },  // 高度  height: 10,  showDetail: false, // 拖拽时候是否显示具体数值信息  showDataShadow: false // 组件中是否显示数据暗影}