Display a data point value in a label

Contents[Hide]

1. Overview

This article shows you how to display the values of the chart column in the label component. This will allow you to show the values without the use of the tooltip.

2. Setting Up

For this example, we have AdventureWorks2012, using Sales.SalesTerritory with Name and SalesLastYear. This is re-visualized to a bar chart.

Sample Chart
Sample Chart

Take note of the script name of the chart that you will be using. This will be used in the script.

Script Name of Chart
Script Name of Chart

3. Adding the label and script

Place the labels in the dashboard: one for the name, and one for the Sales.

Adding Label in the Dashboard
Adding Label in the Dashboard

In Properties > Main > Action > Click, add a new script.

Click Action
Click Action

Place the following code in the Script Editor:

var nameLabel = "";
var valLabel = "";
var myView = dundas.context.baseViewService.currentView;

var myChart = myView.getAdapters().filter(function(a) {
    return a.name == "chart1";
})[0];

var allPoints = myChart.control.series[0].getPoints();
allPoints.forEach(function(point){
    if (point.isSelected){
      nameLabel = point.xValues[0].split(".")[0];
      valLabel = point.yValues[0];
    }
});

label1.labelText = nameLabel;
valLabel = valLabel.toFixed(2);
valLabel = valLabel.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
label2.labelText = "$" + valLabel;

Script Editor
Script Editor

Build the code, and try to run it.

Chart with the label changing
Chart with the label changing

4. See also:

Dundas Data Visualization, Inc.
500-250 Ferrand Drive
Toronto, ON, Canada
M3C 3G8

North America: 1.800.463.1492
International: 1.416.467.5100

Dundas Support Hours: 7am-6pm, ET, Mon-Fri