amcharts5 icon indicating copy to clipboard operation
amcharts5 copied to clipboard

add style for the last legend element

Open flaming-cl opened this issue 1 year ago • 3 comments

Hey, is there a way to add customized styles for the last legend element?

For example, there shouldn't be a border for the last legend item. image

To do that, we need to locate the last legend element in JSON config.

Continue the discussion of a previous thread, how we will know if we are modifying the last legend element? https://github.com/amcharts/amcharts5/issues/1729#issuecomment-2357593437

flaming-cl avatar Oct 21 '24 02:10 flaming-cl

Maybe something like this:

legend.itemContainers.template.setup = function(target) {
  
  target.events.on("boundschanged", function(ev) {
    var line = ev.target.children.getIndex(0);
    line.setAll({
      points: [
        { x: 0, y: 14 },
        { x: ev.target.width() - ev.target.get("paddingRight", 0), y: 14 }
      ]
    });
    if (series.dataItems.indexOf(line.dataItem.dataContext) == (series.dataItems.length - 1)) {
      line.hide(0);
    }
  });
  
  var line = target.children.push(am5.Line.new(root, {
    stroke: am5.color(0x000000),
    strokeOpacity: 0.5,
    isMeasured: false,
    points: []
  }));
};

martynasma avatar Oct 21 '24 05:10 martynasma

Hey @martynasma, thanks for the suggestion. One small question on this is:
The above code is inside JSON config, meaning "chart" hasn't been generated yet. So we are not sure how to get "series.dataItems" in the JSON config.

Is there a way to get the parent element of target (aka the legend itself) inside the setup function?

flaming-cl avatar Oct 21 '24 19:10 flaming-cl

target.parent will reference to the legend itself. target.parent.parent - to chart.

martynasma avatar Oct 22 '24 05:10 martynasma