Reference Line text is cut off in Bar Chart

RE: Reference Line text is cut off in Bar Chart

Aby Amores — Mon, 08 Apr 2019 19:09:05 GMT

That's true. I will create a support ticket for this issue.

Also, adding a header does not solve in the column or bar chart. Thanks a lot for your reply, ankushj!

RE: Reference Line text is cut off in Bar Chart

Aby Amores — Mon, 08 Apr 2019 19:07:26 GMT

That would be a workaround, yes. I can probably use it in the meantime. Thanks Stewart!

RE: Reference Line text is cut off in Bar Chart

ankushj — Mon, 08 Apr 2019 18:10:29 GMT

The best solution would be to raise support ticket as suggested by Stewart. But alternate quick solution would be if you can give label to your columnChartField.

a!columnChartField(
label: "Heading",
labelPosition: "ABOVE",
categories: {"Stage 1", "Stage 2", "Stage 3", "Stage 4", "Stage 5", "Stage 6", "Stage 7"},
series: a!chartSeries(
label: "# Opportunities",
data: a!forEach(
items: enumerate(7) + 1,
expression: with(
rand()*20+1
)
),
color: "ACCENT"
),
showLegend: false,
showTooltips: true,
referenceLines: {
a!chartReferenceLine(
label: "Level One",
value: 5
),
a!chartReferenceLine(
label: "Level Two",
value: 10
),
a!chartReferenceLine(
label: "Level Three",
value: 15
),
a!chartReferenceLine(
label: "Level Four",
value: 20
)
}
)

RE: Reference Line text is cut off in Bar Chart

Stewart Burchell — Mon, 08 Apr 2019 17:16:43 GMT

(The real answer is to raise a Support Ticket with Appian and get them to either provide an answer or a fix)

RE: Reference Line text is cut off in Bar Chart

Stewart Burchell — Mon, 08 Apr 2019 17:15:56 GMT

So...another (not very nice, but still an) option is...to artificially append one column that contains the maximum value possible in your chart, and label it "Reference Maximum Score" or some such...this then forces the chart to stretch beyond the maximum and thus your top reference line is always rendered correctly...it's not elegant but it works:

a!columnChartField(
  labelPosition: "ABOVE",
  categories: {"Stage 1", "Stage 2", "Stage 3", "Stage 4", "Stage 5", "Stage 6", "Stage 7","Maximum (for Reference"},
  series: a!chartSeries(
    label: "# Opportunities",
    data: {
      a!forEach(
      items: enumerate(7) + 1,
      expression: with(
        rand()*20+1
      )
    ),
    20
    },
    color: "ACCENT"
  ),
  showLegend: false,
  showTooltips: true,
  referenceLines: {
    a!chartReferenceLine(
      label: "Level One",
      value: 5
    ),
    a!chartReferenceLine(
      label: "Level Two",
      value: 10
    ),
    a!chartReferenceLine(
      label: "Level Three",
      value: 15
    ),
    a!chartReferenceLine(
      label: "Level Four",
      value: 20
    )
  }
)

RE: Reference Line text is cut off in Bar Chart

Aby Amores — Mon, 08 Apr 2019 16:58:26 GMT

Thanks for your reply, Stewart. Unfortunately, I do want all the reference lines to be shown as you saw in the example.

And that's true, a forEach function should be used here. The snippet code was just an example of how to reproduce the issue that I made on the fly, it is not the actual code. I appreciate all your suggestions, though!

RE: Reference Line text is cut off in Bar Chart

Stewart Burchell — Mon, 08 Apr 2019 15:24:06 GMT

So, I had a little try out and see what you mean. One way is to avoid the situation. You can use the 'showWhen' to NOT show the reference line if none of the values in your chart are above that value. That is, your last reference line will be that which is immediately below your maximum value. That may or may not be an acceptable solution (looking at your first example I suspect not - you want to have the full range by the looks of it)

(Off-topic: I also noticed that you're effectively repeating the a!chartReferenceLine() component, so you could derive these using some data and the a!forEach() to make the code more flexible for maintenance purposes.)

RE: Reference Line text is cut off in Bar Chart

Aby Amores — Mon, 08 Apr 2019 14:19:44 GMT

Thanks for your reply. I don't think it is because of the resolution. I have tried many devices and browsers.

Please find the snippet code below. (It also happens in column charts)

a!columnChartField(
              labelPosition: "ABOVE",
              categories: {"Stage 1", "Stage 2", "Stage 3", "Stage 4", "Stage 5", "Stage 6", "Stage 7"},
              series: a!chartSeries(
                label: "# Opportunities",
                data: a!forEach(
                  items: enumerate(7) + 1,
                  expression: with(
                    rand()*20+1
                  )
                ),
                color: "ACCENT"
              ),
              showLegend: false,
              showTooltips: true,
              referenceLines: {
                a!chartReferenceLine(
                  label: "Level One",
                  value: 5
                ),
                a!chartReferenceLine(
                  label: "Level Two",
                  value: 10
                ),
                a!chartReferenceLine(
                  label: "Level Three",
                  value: 15
                ),
                a!chartReferenceLine(
                  label: "Level Four",
                  value: 20
                )
              }
            )

RE: Reference Line text is cut off in Bar Chart

Aby Amores — Mon, 08 Apr 2019 14:16:37 GMT

Thanks for your reply Gaurav. I have tried in different browsers and also on mobile devices but this issue is still present.

RE: Reference Line text is cut off in Bar Chart

aloks0189 — Mon, 08 Apr 2019 04:34:20 GMT

I believe it's because of the resolution or UI layout configuration of your screen.

Also, is it possible for you to share the code snippet of your interface (by setting some dummy data)?

RE: Reference Line text is cut off in Bar Chart

Gaurav Arora — Fri, 05 Apr 2019 23:23:57 GMT

Hi, May you try in some other browser, it might be an issue of your screen resolution.