Skip to content

[examples] Added UI guidance to append data arrays example #496

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
Adityashandilya555 wants to merge 3 commits into from
Closed

[examples] Added UI guidance to append data arrays example #496

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6b24280
[examples] Added UI guidance to append data arrays example #492
Adityashandilya555 Jan 23, 2026
6b63ef8
Merge branch 'master' into add-ui-guidance-arrays-example
Adityashandilya555 Jan 23, 2026
3408a94
Merge branch 'master' into add-ui-guidance-arrays-example
Adityashandilya555 Jan 24, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
44 changes: 43 additions & 1 deletion public/example_templates/netjsonmap-appendData2.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,52 @@
<!-- theme can be easily customized via css -->
<link href="../lib/css/netjsongraph-theme.css" rel="stylesheet" />
<link href="../lib/css/netjsongraph.css" rel="stylesheet" />
<style>
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#map-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div
id="info-banner"
style="
position: fixed;
top: 10px;
left: 50%;
transform: translateX(-50%);
background: rgba(52, 73, 94, 0.95);
color: white;
padding: 12px 20px;
border-radius: 8px;
font-size: 14px;
z-index: 1000;
max-width: 90%;
text-align: center;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
"
>
<strong>Append Data Using Arrays:</strong> This example demonstrates
loading multiple JSON data files at once using an array. <br /><em
>All three data files are loaded and combined automatically when the map
initializes.</em
>
</div>
<div id="map-container"></div>
<script type="text/javascript">
/*
Using array files to append data step by step at start.
Using array files to append data step by step at start.
Similiar to the first method, but easier.
*/
Comment on lines +61 to 63
Copy link

@coderabbitai coderabbitai bot Jan 24, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Fix typo in comment (Line 62).

“Similiar” → “Similar”.

✏️ Suggested fix 
-          Similiar to the first method, but easier.
+          Similar to the first method, but easier.
🤖 Prompt for AI Agents 
In `@public/example_templates/netjsonmap-appendData2.html` around lines 61 - 63,
Fix the typo in the block comment that reads "Similiar to the first method, but
easier." — update the word "Similiar" to "Similar" in the comment near the
array-files append-data section in
public/example_templates/netjsonmap-appendData2.html so the sentence reads
"Similar to the first method, but easier."

const map = new NetJSONGraph(
Expand All @@ -27,6 +68,7 @@
"../assets/data/netjsonAppendData/3.json",
],
{
el: "#map-container",
render: "map",
// set map initial state.
mapOptions: {
Expand Down
Loading