One of Power BI's major strengths is staying connected to your data from anywhere, anytime, with the Power BI app for Windows, iOS, and Android. Business users can get a 360° view of your business data on the go - at the touch of their fingertips.
Mobile consumption plays a major role in Power BI, and creating custom visuals that address the unique needs of mobile devices should be one of your top of minds as a developer, to reach as many user as possible and provide them with the best experience possible.
The following requirements are essential in development of mobile-friendly visual.
Custom visual must render on all supported mobile browsers and mobile applications without errors in reports, dashboards and in focus mode.
Interactivity is important in order to provide the same functionality as for desktop devices. Try to support all events that are handled on desktop browsers or support analogous event handlers for mobile devices. Selection of data points and navigation should be implemented if visual provides such functionality on desktop browsers. If visual supports multi-selecting using Ctrl key - consider adding similar event handling for mobile devices.
Note that some mobile devices (touch screen devices) don't support any mouse events (all events with "mouse" prefix). In other words, you have to listen to mouse and touch events at the same.
Use the following table in order to choose the correct event name at mobile devices:
| Mouse event name | Touch event name |
|---|---|
| click | click |
| mousemove | touchmove |
| mousedown | touchstart |
| mouseup | touchend |
| dblclick | Use external library |
| contextmenu | Use external library |
| mouseover | touchmove |
| mouseout | touchmove (external library) |
| wheel | NaN |
Consider implementing requirements below to provide the best experience for mobile users.
Visual should be mobile-friendly in Focus mode – it should be optimized for the mobile screen size and looks good both in portrait and landscape orientations.
Support small sizes of the visual. Add new formatting options so a user will be able to change the size of visual elements (for example, of labels). Such improvement will allow users to customize visual for their reports or dashboards on mobile devices. Note that the same settings will be applied to the visual in desktop browsers. If needed, you can override user formatting settings in order to adapt your visual to the small sizes of the visual.
Visual should show descriptive error if it cannot be rendered on mobile devices for some reasons.
Consider adding mobile-specific event handlers, like dragging and scrolling.
Visual should be rendered on all devices that support Power BI Apps.
Testing against latest models of Windows, iOS and Android devices should cover most quality aspects. Use the following devices list for testing to be sure that your visual provides the best experience to mobile users:
- iPhone devices
- iPhone 7
- iPhone 6
- iPad tablets
- iPad 5
- Android devices
- Samsung Galaxy S7 Edge
- Samsung Galaxy S6
- Android tablets
- Google Nexus 7
- Samsung Galaxy Tab
- Windows Phone devices
- Surface Pro 4
- Lumia 950 or Lumia 950 XL