Up Down Arrow for Numeric Inputs in Custom Visual

[bhavesh-jadav]

Hello there,

I want to show up down arrow for numeric field in custom visual just like we have for font-size. I am using following syntax for numeric field

"decimalPlaces": {
   "displayName": "Value Decimal Places",
    "type": {
       "numeric": true
   }
}

Which produces following results.

It would be better if we can show arrows for quick value changes. How do I add arrows to this field?

[v-chuncz-msft]

@bhavesh-jadav,

You may try type enumeration.

https://github.com/Microsoft/PowerBI-visuals-tools/blob/master/templates/visuals/.api/v1.13.0/schema...

[v-viig]

Power BI has a few hard coded property names that will force PBI to show arrows.

What value range are you instrested in? If there's no specific value range we would recommend to keep it as it.

PBI users actually can use Keyboard Arrows to increase/decrease values.

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

[email protected]

[bhavesh-jadav]

It is really convenient to click on arrows to adjust the number. Default Power BI visual shows arrows for numeric inputs so I thought end user would expect similar thing in custom visual.

Also how do I set range for numeric input? Is there a way to do it in capabilities.json file or do I have to manage it in the code?

[v-viig]

What default vsiuals are you talking about?

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

[email protected]

[bhavesh-jadav]

Default visuals, for example in card visual to change decimal places you have numeric text box with arrows. Another example is in line and combo charts to adjust stroke width power bi shows numeric text box with arrows.

[v-viig]

As mentioned above, Power BI uses special types and hard coded name for such case.

If you wanted to show box with arrow to stroke width you should call your property as: strokeWidth

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

[email protected]

[bhavesh-jadav]

@v-viig Now I understand that I have to used predefined properties name in order to get that arrows and there is no other way as of now. Can you please provide if possible the list of all predefined proerties such as strokeWidth which I can use to get desired settings?

[v-viig · Accepted solution]

This is a full list of properties that I know about:

• weight

• angle

• textSize

• fontSize

• titleFontSize

• secFontSize

• secTitleFontSize

• outlineWeight

• gridVerticalWeight

• gridHorizontalWeight

• barWeight

• rowPadding

• cardPadding

• imageHeight

• steppedLayoutIndentation

• borderThickness

• preferredCategoryWidth

• strokeWidth

• gridlineThickness

• markerSize

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

[email protected]

[bhavesh-jadav]

Thank you Ignat for the list.