Skip to main content

Suggest an Idea

Vote for your favorite Qlik product ideas and add your own suggestions.

QR code, BarCode as representation inside a table

simonaubert
Partner - Specialist II
Partner - Specialist II

QR code, BarCode as representation inside a table

Hello all,

As the title suggests, I would like to represent somes values as barcode or as QRCode. This allows a quick reading by machine either on a mobile screen or on a print report. There is already existing js library for that  so it should be very easy to implement.

https://en.wikipedia.org/wiki/Barcode



https://en.wikipedia.org/wiki/QR_code

image.png

Best regards,

Simon

Bi Consultant (Dataviz & Dataprep) @ Business & Decision
11 Comments
Patric_Nordstrom
Employee
Employee

Thank you for your feedback on ways to improve our product. While this is something we understand would be useful, it's not on the short-term roadmap. Please continue to show your support for this idea.

Thanks,

Patric

Another option is to use a barcode font, for instance https://fonts.google.com/specimen/Libre+Barcode+128+Text in a custom theme. 

@import url('https://fonts.googleapis.com/css2?family=Libre+Barcode+128+Text&display=swap');
.qv-st-data-cell-numeric * {
font-size: 24px;
font-family: 'Libre Barcode 128 Text', cursive;
}

This sets the font size and family in measure columns of the straight table. 

barcode.png

 

 

Status changed to: Open - Collecting Feedback
Erik_K
Contributor II
Contributor II

Hi,

 

Can you elaborate a bit more on the example you give? Where would you put the code where you get the font?

Is it in a measure or dimension? Or is it somewhere in the load script?

Thanks!

Regards,

Erik

Patric_Nordstrom
Employee
Employee

@Erik_K 

The code in the box above is CSS, it can be placed in the theme.css file of a custom theme.

https://help.qlik.com/en-US/sense-developer/February2021/Subsystems/Extensions/Content/Sense_Extensi...

Another option is to place the code in the css box of the multi kpi object.

Thanks,

Patric

twixMiller0113
Contributor III
Contributor III

@Patric_Nordstrom  Hi Patric! So I'm working on something similar. I've created the custom theme but am unsure on how to apply it in my app even after I changed the app theme. I put the code you provided in my css file but how do I use it now? I also tried putting the css in the multi kpi object but my data still didn't appear as a barcode. 

Patric_Nordstrom
Employee
Employee

@twixMiller0113  don't forget to reference the css in the theme.json

Should work, does my app work in your environment? Make sure the barcode number is in measure field of the table.

Thanks,

Patric

 

twixMiller0113
Contributor III
Contributor III

@Patric_Nordstrom does this only work for integers? Or can it work for text? and I haven't tried your app yet.

Ken_T
Specialist
Specialist

@Patric_Nordstrom was able to follow your notes and get this working for any and all numeric columns in a table chart.   Do you know of any way that this can be done for ONE specific column ?  or how to apply it for ONE specific table chart?   with the example you gave, any number column in any table chart in the whole app will be a barcode.    How can we have some specified columns be barcodes and some be regulars numbers?

Patric_Nordstrom
Employee
Employee

You can use CSS to target a specific table

[tid="f43bf4cf-0e40-4319-bae2-5b6121bca79e"] .qv-object-content {

background-color: green;

}

f43bf4cf-0e40-4319-bae2-5b6121bca79e is the object id, makes the css apply to only one specific chart. Use share>embed to find the object id.

 

Ken_T
Specialist
Specialist

Thanks a bunch @Patric_Nordstrom , that is what we ended up doing - I wish this was built-in functionality without having to hunt for hidden ids and finding odd places to get the css to apply, without having to do a new theme. thanks for the help on this !

Meghann_MacDonald

From now on, please track this idea from the Ideation portal. 

Link to new idea

Meghann

NOTE: Upon clicking this link 2 tabs may open - please feel free to close the one with a login page. If you only see 1 tab with the login page, please try clicking this link first: Authenticate me! then try the link above again. Ensure pop-up blocker is off.