Top values in Bars chart


#1

Hi ChartFactor team, I was playing around with Bars visualization and they are looking good. I created a Stacked Bars, I can hover and see the amounts on each of the stacks. However, I would also like to show totals values at the top of each bar. I am not sure if this is possible or how to do this using Studio.


#2

Hi @frank ChartFactor allows you to do that using a Metric Marker. Here is the documentation: https://chartfactor.com/doc/latest/visualization_options/metric_marker/
With Metric Markers you can set the total value at the top each stack. You can use the same code shown in the documentation:
myChart.set(“metricMarker”, { icon: [{ name: “xAxisValueName” icon: ‘definedIcon’ }], margin: 10, iconSize: 20 })
As you can see, the feature is powerful, it allows you to also provide icons and many additional options. Take a look at the docs to get a better understanding of this feature and please let know if you have any doubts or additional questions.


#3

I saw this feature on bar charts and it is very useful. I am using it all the time to create my dynamic visualizations. I am a little confused though on how to change the icon specification. I wonder if I can set an icon using an external URL path?


#4

Hi @Adam, that is a good question and of course, you can use external sources to set icons on bars charts. This is useful when you have these icons stored in your web server and you don’t want to copy or create again those icons. To do that, you can use this example code: .set(“metricMarker”, { icon: [{ name: “xAxisValue”, icon: “image://URLPathToYourImage” }] })
To specified an external icon path you need to prefix you URL with image:// and that’s all.