如何图例的边框显示不同的颜色

做了个柱形图,一个实际,两个目标,其中两个目标都用透明色,不同边框,但在图例上区分不出来,如何让不同的图例显示不同的边框颜色呢?

企业微信截图_16822142852118.png

FineReport 用户f7632235 发布于 2023-4-23 09:48
1min目标场景问卷 立即参与
回答问题
悬赏:3 F币 + 添加悬赏
提示:增加悬赏、完善问题、追问等操作,可使您的问题被置顶,并向所有关注者发送通知
共2回答
最佳回答
2
YmengLv5中级互助
发布于2023-4-23 15:20

body添加初始化事件

setTimeout(function(){

var a =FR.Chart.WebUtils.getChart("chart1").getChartWithIndex(0); //获取chart1图表对象

var ser1=a.components.legend.items[1];    //获取第二个系列图例

ser1.graphic.path.style({            //设置第二个系列图例边框颜色和线宽

'stroke':'#71E2FE',

    'stroke-width':'1'

});

var oldLegend1=ser1.updateLegendItemGraphicStyle;

ser1.updateLegendItemGraphicStyle=function(){

    oldLegend1.apply(ser1, Array.prototype.slice.call(arguments));

    ser1.graphic.path && ser1.graphic.path.style({

      'stroke-opacity': '1',

      'stroke':'#71E2FE',

      'stroke-width':'1'

    });

};

var ser2=a.components.legend.items[2];  //获取第三个系列图例

ser2.graphic.path.style({               //设置第三个系列图例边框颜色和线宽

'stroke':'#000000',

    'stroke-width':'1'

});

var oldLegend2=ser2.updateLegendItemGraphicStyle;

ser2.updateLegendItemGraphicStyle=function(){

    oldLegend2.apply(ser2, Array.prototype.slice.call(arguments));

    ser2.graphic.path && ser2.graphic.path.style({

      'stroke-opacity': '1',

      'stroke':'#000000',

      'stroke-width':'1'

    });

};

},500)

代码里chart1改成你堆积图的组件名,边框颜色stroke值根据你的需求改

图形不能被联动,联动后代码会失效

image.png

  • 用户f7632235 用户f7632235(提问者) cpt类型的模板也可以这么设置么?
    2023-04-23 16:13 
  • Ymeng Ymeng 回复 用户f7632235(提问者) cpt的你把chart1改成图行所在的单元格试试,例:FR.Chart.WebUtils.getChart(\"A1\").getChartWithIndex(0);
    2023-04-23 16:15 
  • Ymeng Ymeng 回复 用户f7632235(提问者) 斜杠系统自动加的,需要去掉
    2023-04-23 16:16 
  • 用户i2053470 用户i2053470 楼主实现了吗?尝试后没有效果
    2023-05-19 15:36 
  • Ymeng Ymeng 回复 用户i2053470 你是决策报表还是普通报表,代码是需要根据不同需求做对应调整的
    2023-05-19 16:23 
最佳回答
0
Z4u3z1Lv6专家互助
发布于2023-4-23 09:50

自定义图例.rar

试试自定义图例

  • 用户f7632235 用户f7632235(提问者) 不太可行呢
    2023-04-23 10:41 
  • Z4u3z1 Z4u3z1 回复 用户f7632235(提问者) 图例目前没开放接口 只有自己定义。方法类似,也许你可以找到一个更好的自定义方式
    2023-04-23 10:44 
  • 3关注人数
  • 487浏览人数
  • 最后回答于:2023-4-23 15:20
    请选择关闭问题的原因
    确定 取消
    返回顶部