Creating a dhis2 bulletin

Hi,
I want to make a bulletin with some visualizations and their descriptions. like I can make a standard report and then then add it’s link to the login page so anyone can see it if logged in. or somewhere else. But till now I have brought the whole tab to the screen on the right and description on the left.


Now I want only the visualization, not the whole tab.
I will share the code as well for better understanding.

Code:

<html>
<head>
    <title>DHIS2 Bulletin Report</title>
</head>
<body>
    <h2>Health Statistics Report</h2>
    <div style="display: flex; align-items: flex-start; gap: 20px;">
        <div style="flex: 1;">
            <h3>Acute Respiratory Infections</h3>
            <p>This visualization shows the trend of Acute Respiratory Infections.</p>
            <p>Acute respiratory infections (ARIs) are a major public health concern in KPK. These infections affect the airways and can range from mild conditions like the common cold to more severe illnesses like pneumonia. The visualization tracks reported cases across different districts, helping identify patterns and areas needing intervention.</p>
            <p>Key points about ARIs:</p>
            <ul>
                <li>Most common during winter months</li>
                <li>Affects both children and adults</li>
                <li>Preventable through proper hygiene and vaccination</li>
                <li>Early detection and treatment is crucial</li>
            </ul>
        </div>
        <div style="flex: 1;">
            <iframe src="https://Mylink/dhis-web-data-visualizer/#/visualisation id" width="150%" height="500"></iframe>
        </div>
    </div>

    
</body>
</html>

Hi @Tahir_Zaman

Do you want the Visualization to appear for all even if they’re not logged in? Maybe you could download the visualization as image and link it to the visualization?

If it’s only for logged in viewers, then you could add the chart to a dashboard then embed the dashboard which will show the visualization without the tab.

Yeah, but I want the visualizations to update automatically. and also the user is logged in.

1 Like

In this case maybe try the following suggestion?

This means that the iframe link will instead direct to the Dashboard the contains the Visualization. It’ll automatically update and the user will need to be logged in. :slight_smile:

Hi @Tahir_Zaman

Were you able to figure out a solution to your use-case? Thanks!

no when i used iframe i didn’t know something i did that caused the whole instance to be opened in the iframe like a nested instance. but it was no longer needed as the request was fulfiled with the using dashboard directly.

1 Like

Hi Tahir Zaman!

The URL contains a space: visualisation id → this will break the link.

Remove the space in the fragment identifier.

iframe width=“150%” is not standard

Use 100% or adjust with CSS if you want it to overflow intentionally.

No declaration, which may cause quirks mode rendering in older browsers.

Add the DOCTYPE at the very top

I’m sure you can do it :clap:

2 Likes