topic Re: Set color by expression in extension in Integration, Extension & APIs

Set color by expression in extension

Thu, 10 Aug 2017 15:26:18 GMT

Hi all,

I would like to define the coloring option by expression in the properties panel of a visualization extension.

I looked at several extensions and none of them have used any expressions in the properties panel excluding dimension, measure, and appearance > general panes which are all auto created/defined parts of the properties panel, having no setting attributes in the js file.

When I tried the expression: "always" element in the js file I got the orange fx sign show up in the properties panel but the calculations were not carried out...

Any kind of help would be greatly appreciated!

Re: Set color by expression in extension

jonvitale — Mon, 16 Oct 2017 15:05:21 GMT

Barnabas,

I wonder if you are still working on this after two months, if so do you have any updates? I'm working on a similar issue, I've gotten maybe one step further, but still a bit lost:

I want to add custom coloring options to my dimensional values. I add new items to my properties panel like this:

dimensions: {

uses: "dimensions",

min: 2,

max: 6,

items: {

colorExpression:{

type: "string",

label: "Enter color expression",

ref:"qDef.myColorSelection.expression",

expression:"always"

}

This allows me to enter an expression for each dimension within my properties panel user interface. So, if my dimension is called D1 and includes some value like "monkey", I might write:

= If(D1 = "money", '#665522', '#000000')

Now, if I run the app and break somewhere in the paint function, I'll see the following in

layout.qHyperCube.qDimensionInfo[0].myColorSelection.expression

which evaluates to '#000000' (i.e., the 'else' clause of my expression).

This is not what I want. I do not want a single color for each dimension. I want each different value in the dimension to evaluate to its own color. So 'monkey' values in D1 should be '#665522', 'tiger' should be '#DDCC33', etc.

Hopefully someone picks up this thread. Looking at erik.wetterberg‌ and akl‌

Re: Set color by expression in extension

ErikWetterberg — Mon, 16 Oct 2017 20:30:32 GMT

Hi,

The easiest way to achieve this is to simply add another measure and use that for color.

Erik Wetterberg

Re: Set color by expression in extension

jonvitale — Mon, 16 Oct 2017 20:48:00 GMT

Erik,

Thanks for replying, but I'm not sure I understand. I have multiple dimensions that need to be colored independently. I think a close relative of what I'm looking for is in the out-of-the-box Table object. In this object, within the Data tab, you can add multiple Dimensions as columns. Expanding the added dimensions, you get the option of entering a "Background color expression" and a "Text color expression". This is then evaluated on a row-by-row basis in the table.

Any ideas or alternatively, do you know if there is a way to look at the source for the Table object?

Re: Set color by expression in extension

ErikWetterberg — Tue, 17 Oct 2017 10:19:17 GMT

Hi,

You are right, adding an extra measure is for a one dimension scenario. The built-in table uses qAttributeExpressions, mentioned here. I don't think Qlik has published any property panel component for this, so you have the alternatives of trying to see what the table does or building something yourself.

Erik Wetterberg

Re: Set color by expression in extension

jonvitale — Tue, 17 Oct 2017 12:50:10 GMT

Erik,

I'll play around with and see what I come up with. By the way, your link was broken for me. But this one seems to work.

I may also open up a new thread about this topic - just in the hopes that someone who knows might stumble by a new question. Seems unlikely, but at least I would be able to curate the thread a bit.

Re: Set color by expression in extension

jonvitale — Wed, 18 Oct 2017 14:27:49 GMT

erik.wetterberg‌

I was able to successfully color my dimensions by using this as an item in my dimensions.

colorExpression:{

type: "string",

label: "Enter color expression",

ref:"qAttributeExpressions.0.qExpression",

expression:"optional"

}

This applies the expression to all of the rows in the hypercube matrix. It's very nice. I can then use some app-specific logic to figure out what colors to display to represent the dimensional objects.

However, the problem I'm running into now, is I want another way to color that has nothing to do with dimensions. I'd like to put a "color by expression" somewhere in an "appearance" section of the properties panel. The syntax of the item I use is almost identical to above. However, using the ref "qAttributeExpressions.0.qExpression" doesn't actually run the expression on each row of the matrix. Instead I'll find something like layout.qAttributeExpressions[0].qExpression, with an un-evaluated expression (e.g., "=IF(...)")

Do you know if there is any kind of way to force Qlik to evaluate the expression on each row from within the properties channel? I suppose the other option is to grab the unevaluated color expression in the paint function, evaluate it on each row, and color accordingly.

Thanks - and when I get this all worked out I'll try to put some documentation up so others can benefit.

Re: Set color by expression in extension

ErikWetterberg — Wed, 18 Oct 2017 14:42:10 GMT

Hi,

If you want it evaluated for each row in the matrix you have as far as I know two alternatives:

add it as a measure
use qAttributeExpression

BTW well done with the attribute expression!

Erik Wetterberg

Re: Set color by expression in extension

jonvitale — Fri, 20 Oct 2017 17:11:56 GMT

erik.wetterberg‌

So, in my app, we are using the first measure for sizing a visualization. I suppose I could make the minimum number of measures 2, and then use the second measure as a color measure.

However, this doesn't seem like good practice. In most of the out-of-the-box visualizations you can create a new measure in the "Appearances" section of the app. This way it is absolutely clear to users that they are making a measure specifically for coloring. As far as you know, is there a way to do this in an extension? Is there a way to tell Qlik that "some expression" should be an attribute of a new measure?

To be perfectly clear, let's say that I have this as part of my definition code:

measures: {

uses: "measures",

min: 1,

max: 3

myAppearancePanel: {

label: "My Appearance Section where you can create a new measure to color the visualization",

I_Want_A_New_Measure_For_Color:{

type: "string",

expression: "optional",

label: "Color by expression",

ref:"qAttributeExpressions.0.qExpression"

}

This code is not creating a new measure. It just puts an un-evaluated expression in the layout at qAttributeExpressions[0].qExpression

Thanks again for the help.

Re: Set color by expression in extension

ErikWetterberg — Sat, 21 Oct 2017 07:23:41 GMT

Hi,

AttributeExpression will work only in dimensions. I haven't tried this, but you probably could set ref to something like:

qHypercubeDef.qMeasures.1.qDef

Probably the best way is to look at how this is done in the built-in charts.

Hope this helps

Erik Wetterberg

Re: Set color by expression in extension

jonvitale — Sat, 21 Oct 2017 16:14:44 GMT

I'll try that, but one last question and I'll stop bugging you. Do you know how to view the code for the built in charts? that would certainly solve all my problems.

Re: Set color by expression in extension

jonvitale — Mon, 23 Oct 2017 13:17:13 GMT

erik.wetterberg‌

Unbelievable, it worked! The actual code for the reference should be this:

qHyperCubeDef.qMeasures.1.qDef.qDef

(the first qDef is an object containing the qDef expression.). The new calculated measure now sits there right along side my other measure.

I think this is all I need. When I put everything together, I'll write up a little reference guide and be sure to give you a lot of credit!

Re: Set color by expression in extension

pasi_lehtinen — Wed, 08 Nov 2017 17:38:00 GMT

Hi Jonathan,

I came up with the same need. Could you please share the complete solution?

Thanks in advance

Re: Set color by expression in extension

jonvitale — Wed, 08 Nov 2017 18:01:23 GMT

Hi Pasi,

What exactly are you trying to do? I found that if I used a reference like, "qHyperCubeDef.qMeasures.1.qDef.qDef", anywhere in the property definition, I could define a new measure. You'll even see this measure in the list of measures. But it didn't quite work because the visualization would crash when I tried to put a new visualization on a sheet. Not sure why.

I wound up just adding a new expression attribute to my dimensions. Which I can explain if you need help. Let me know what you are working on. Really I want to document this whole thing at some point anyhow.

Jonathan

Re: Set color by expression in extension

Anonymous — Thu, 22 Feb 2018 13:08:03 GMT

Hi im working with navigation button and I have to add a functionality in it ColorByExpression so I have included this in my code

colorExpression:{

type: "string",

label: "Enter color expression",

ref:"qHyperCubeDef.myColorSelection.expression",

expression:"always"

}

but still im not able to achive this.

I also want to ask is myColorSelection.expression is a builtin functionality of qHypercubeDef or we have to add its definition else where in the code also???

Please help me out in this.

Re: Set color by expression in extension

ErikWetterberg — Thu, 22 Feb 2018 17:35:33 GMT

Hi,

If you do not have a HyperCubeDef in your properties structure (most likely for a button) then you cant use this method. Instead you could use a string or possibly a color-picker.

Hope this helps

Erik Wetterberg

Re: Set color by expression in extension

Anonymous — Thu, 01 Mar 2018 02:48:36 GMT

Hi Erik,

I have to change the background color of the navigation button when I click on it and it gets back to the original color when I select any other navigation button. how can I do it?

I tried using this code for that purpose. I have also set the variables and kept this expression in background color field

expression ---> if(vbutton='1',Red(),Green()).

but it didn't work out.

can u suggest me any alternate way or code which whould help me out of this issue.

Thanx

sadhana

Re: Set color by expression in extension

Anonymous — Thu, 01 Mar 2018 02:56:44 GMT

Hi,

can we do the same to change the background color of the extension based on set variable.

Thanx

sadhana

Re: Set color by expression in extension

humesh_sindpure — Thu, 22 Mar 2018 09:22:47 GMT

Hello Jonathan Sir,

My name is Humesh . I am developing an extention for table.I want to add custome color property to every dimentions and measures.

I found your this code :

colorExpression:{
type: "string",
label: "Enter color expression",
ref:"qAttributeExpressions.0.qExpression",
expression:"optional"
}

I have written this code inside of dimention shown below:

definition : {

type : "items",

component : "accordion",

items : {

dimensions : {

uses : "dimensions",

min : 1,

items: {

colorExpression:{

type: "string",

label: "Enter color expression",

ref:"qAttributeExpressions.0.qExpression",

expression:"optional"

}

now please tell me what should I need to write inside of function

paint: function ($element,layout) {

}

please give me solution

Re: Set color by expression in extension

jonvitale — Thu, 22 Mar 2018 13:33:55 GMT

Humeshkumar,

You'll need to loop through all rows of the Hypercube. The row itself will be an array with each dimension and each column, so given that you are putting this in the first dimension, the index you'll want to use is 0.

So, something like this.

this.backendApi.eachDataRow( function (rownum, row){

var dimIndex = 0; // you are putting the value in your first dimension

row[dimIndex].qAttrExps.qValues[0].qText

}

Good luck