Responsive Legend

  • Hi

    I’m trying to set up a responsive legend:
    – there are only 3 items in the legend, so I’d like to have a single row.
    – works fine for desktop, but mobile resolves to 2 rows (2 items in the first and 1 item in the second row).
    – the responsive wrapper works fine – I can make other changes to fontsize, color, etc for mobile.

    Other than this one issue, the responsive function works fine!

    // adjust legend – horiz pos
    legend.setAll ( {
    y: null,
    centerY: null,
    x: am5.p50,
    centerX: am5.percent ( 50 ),
    dx: 0,
    dy: 0,

    layout: am5.GridLayout.new ( root, {
    maxColumns: 3,
    maxRows: 1,
    fixedWidthGrid: false,

    } )
    } );

    // adjust labels
    legend.labels.template.setAll ( {
    fontSize: “.8rem”,
    fontWeight: “300”,

    maxWidth: 20,
    // notes
    // – the following params don;t seem to work with multi-column grids
    // oversizedBehavior: “truncate”,
    // ellipsis: “…”,

    } );`
    `etc…

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author martynasma

    (@martynasma)

    This sounds like a complex amCharts-related question, rather than one related to WP plugin.

    Can you repost your question on GitHub?

    https://github.com/amcharts/amcharts5/issues

    Also, if you could isolate your chart in question into a CodePen, that would go a great lengths towards a quicker solution.

    Thread Starter yinxingmaiming

    (@yinxingmaiming)

    OK, will do.

    But in the short-term, can I just ask – is there any limit to the number of columns in a responsive legend – meaning, is amcharts somehow hard-coded so there can’t be more than 2 columns for a mobile form factor?

    Thx – not trying wiggle out of posting on github, but the above is my real question…:>)

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Responsive Legend’ is closed to new replies.