Skip to content

Commit

Permalink
Merge 41bfc78 into 65abbbf
Browse files Browse the repository at this point in the history
  • Loading branch information
totallynotvaishnav authored Aug 5, 2022
2 parents 65abbbf + 41bfc78 commit 3be8459
Show file tree
Hide file tree
Showing 19 changed files with 156 additions and 387 deletions.
2 changes: 1 addition & 1 deletion dist/netjsongraph.min.js

Large diffs are not rendered by default.

55 changes: 11 additions & 44 deletions examples/netjson-searchElements.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,51 +11,20 @@
<script type="text/javascript" src="../dist/netjsongraph.min.js"></script>
<script type="text/javascript">
/*
The demo is used to show the use of the `searchElements` function.
For test, you can input `test` and click the `search` button.
See the following comments for details.
*/
The demo is used to show the use of the `searchElements` function.
For test, you can input `test` and click the `search` button.
See the following comments for details.
*/
// `graph` render defaultly.
let graph = new NetJSONGraph("./data/netjsonmap.json", {
onLoad: function () {
const gui = this.utils.getGUI(this);
gui.init();
if (this.config.metadata) {
gui.createAboutContainer(graph);
this.utils.updateMetadata.call(this);
}
if (this.config.switchMode) {
gui.renderModeSelector.onclick = () => {
if (this.config.render === this.utils.mapRender) {
this.config.render = this.utils.graphRender;
this.echarts.dispose();
graph = new NetJSONGraph(this.data, {
...this.config,
});
graph.render();
} else {
this.config.render = this.utils.mapRender;
this.config.render(this.data, this);
}
};
}
this.config.onClickElement = (type, data) => {
let nodeLinkData;
if (type === "node") {
nodeLinkData = this.utils.nodeInfo(data);
} else {
nodeLinkData = this.utils.linkInfo(data);
}
gui.getNodeLinkInfo(type, nodeLinkData);
gui.sideBar.classList.remove("hidden");
};
onReady: function () {
let searchContainer = document.createElement("div"),
searchInput = document.createElement("input"),
searchBtn = document.createElement("button"),
/*
Pass in the url to listen to, and save the returned function.
Please ensure that the return value of the api is the specified json format.
*/
Pass in the url to listen to, and save the returned function.
Please ensure that the return value of the api is the specified json format.
*/
searchFunc = this.utils.searchElements.call(
this,
"https://ee3bdf59-d14c-4280-b514-52bd3dfc2c17.mock.pstmn.io/?search=",
Expand All @@ -79,9 +48,9 @@
let inputValue = searchInput.value.trim();

/*
Pass in the relevant search value,
which will re-render automatically according to the request result within the function.
*/
Pass in the relevant search value,
which will re-render automatically according to the request result within the function.
*/
if (inputValue === "appendData") {
// appendData
searchFunc(inputValue, false);
Expand All @@ -91,8 +60,6 @@

searchInput.value = "";
};

this.utils.hideLoading();
},
});

Expand Down
34 changes: 1 addition & 33 deletions examples/netjson-switchRenderMode.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,40 +14,8 @@
The demo is used to show how to switch the netjsongraph render mode -- `svg` or `canvas`.
*/
const graph = new NetJSONGraph("./data/netjsonmap.json", {
onLoad: function () {
onReady: function () {
switchRenderMode(this);
const gui = this.utils.getGUI(this);
gui.init();
if (this.config.metadata) {
gui.createAboutContainer(graph);
this.utils.updateMetadata.call(this);
}
if (this.config.switchMode) {
gui.renderModeSelector.onclick = () => {
if (this.config.render === this.utils.mapRender) {
this.config.render = this.utils.graphRender;
this.echarts.dispose();
graph = new NetJSONGraph(this.data, {
...this.config,
});
graph.render();
} else {
this.config.render = this.utils.mapRender;
this.config.render(this.data, this);
}
};
}
this.config.onClickElement = (type, data) => {
let nodeLinkData;
if (type === "node") {
nodeLinkData = this.utils.nodeInfo(data);
} else {
nodeLinkData = this.utils.linkInfo(data);
}
gui.getNodeLinkInfo(type, nodeLinkData);
gui.sideBar.classList.remove("hidden");
};
this.utils.hideLoading();
},
});

Expand Down
42 changes: 9 additions & 33 deletions examples/netjsongraph-nodeExpand.html
Original file line number Diff line number Diff line change
Expand Up @@ -41,40 +41,16 @@
});
},

onLoad: function () {
const gui = this.utils.getGUI(this);
gui.init();
if (this.config.metadata) {
gui.createAboutContainer(graph);
this.utils.updateMetadata.call(this);
}
if (this.config.switchMode) {
gui.renderModeSelector.onclick = () => {
if (this.config.render === this.utils.mapRender) {
this.config.render = this.utils.graphRender;
this.echarts.dispose();
graph = new NetJSONGraph(this.data, {
...this.config,
});
graph.render();
} else {
this.config.render = this.utils.mapRender;
this.config.render(this.data, this);
}
};
onClickElement: function (type, data) {
let nodeLinkData;
if (type === "node") {
nodeLinkData = this.utils.nodeInfo(data);
} else {
nodeLinkData = this.utils.linkInfo(data);
}
this.config.onClickElement = (type, data) => {
let nodeLinkData;
if (type === "node") {
nodeLinkData = this.utils.nodeInfo(data);
} else {
nodeLinkData = this.utils.linkInfo(data);
}
gui.getNodeLinkInfo(type, nodeLinkData);
clickElement.call(this, type, data);
gui.sideBar.classList.remove("hidden");
};
this.utils.hideLoading();
this.gui.getNodeLinkInfo(type, nodeLinkData);
clickElement.call(this, type, data);
this.gui.sideBar.classList.remove("hidden");
},
});

Expand Down
13 changes: 0 additions & 13 deletions examples/netjsonmap-animation.html
Original file line number Diff line number Diff line change
Expand Up @@ -75,19 +75,6 @@
},
},
},
// set map tiles config, can set multiple values.
mapTileConfig: [
{
label: "Blue Street",
urlTemplate:
"http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetPurplishBlue/MapServer/tile/{z}/{y}/{x}",
options: {
minZoom: 0.25,
maxZoom: 18,
},
},
],

// Convert to internal json format
prepareData: (data) => {
data.nodes.map((node) => {
Expand Down
35 changes: 1 addition & 34 deletions examples/netjsonmap-appendData.html
Original file line number Diff line number Diff line change
Expand Up @@ -55,38 +55,7 @@
});
},

onLoad: function () {
const gui = this.utils.getGUI(this);
gui.init();
if (this.config.metadata) {
gui.createAboutContainer(map);
this.utils.updateMetadata.call(this);
}
if (this.config.switchMode) {
gui.renderModeSelector.onclick = () => {
if (this.config.render === this.utils.mapRender) {
this.config.render = this.utils.graphRender;
this.echarts.dispose();
graph = new NetJSONGraph(this.data, {
...this.config,
});
graph.render();
} else {
this.config.render = this.utils.mapRender;
this.config.render(this.data, this);
}
};
}
this.config.onClickElement = (type, data) => {
let nodeLinkData;
if (type === "node") {
nodeLinkData = this.utils.nodeInfo(data);
} else {
nodeLinkData = this.utils.linkInfo(data);
}
gui.getNodeLinkInfo(type, nodeLinkData);
gui.sideBar.classList.remove("hidden");
};
onReady: function () {
/*
The map has this property only after the map is rendered,
so we have to put the relevant function in `onLoad` life cycle
Expand Down Expand Up @@ -114,8 +83,6 @@
Reflect.deleteProperty(tilesMap, curZoom);
}
});

this.utils.hideLoading();
},
});

Expand Down
36 changes: 2 additions & 34 deletions examples/netjsonmap-indoormap.html
Original file line number Diff line number Diff line change
Expand Up @@ -70,39 +70,8 @@
});
},

onLoad: function presentIndoormap() {
const gui = this.utils.getGUI(this);
gui.init();
if (this.config.metadata) {
gui.createAboutContainer(graph);
gui.sideBar.classList.add("hidden");
this.utils.updateMetadata.call(this);
}
if (this.config.switchMode) {
gui.renderModeSelector.onclick = () => {
if (this.config.render === this.utils.mapRender) {
this.config.render = this.utils.graphRender;
this.echarts.dispose();
graph = new NetJSONGraph(this.data, {
...this.config,
});
graph.render();
} else {
this.config.render = this.utils.mapRender;
this.config.render(this.data, this);
}
};
}
this.config.onClickElement = (type, data) => {
let nodeLinkData;
if (type === "node") {
nodeLinkData = this.utils.nodeInfo(data);
} else {
nodeLinkData = this.utils.linkInfo(data);
}
gui.getNodeLinkInfo(type, nodeLinkData);
gui.sideBar.classList.remove("hidden");
};
onReady: function presentIndoormap() {
this.gui.sideBar.classList.add("hidden");

const netjsonmap = this.leaflet;
const image = new Image();
Expand All @@ -127,7 +96,6 @@
});
// add indoormap image
L.imageOverlay(image, bounds).addTo(netjsonmap);
this.utils.hideLoading();
},
});

Expand Down
35 changes: 1 addition & 34 deletions examples/netjsonmap-nodeTiles.html
Original file line number Diff line number Diff line change
Expand Up @@ -56,38 +56,7 @@
});
},

onLoad: function () {
const gui = this.utils.getGUI(this);
gui.init();
if (this.config.metadata) {
gui.createAboutContainer(map);
this.utils.updateMetadata.call(this);
}
if (this.config.switchMode) {
gui.renderModeSelector.onclick = () => {
if (this.config.render === this.utils.mapRender) {
this.config.render = this.utils.graphRender;
this.echarts.dispose();
graph = new NetJSONGraph(this.data, {
...this.config,
});
graph.render();
} else {
this.config.render = this.utils.mapRender;
this.config.render(this.data, this);
}
};
}
this.config.onClickElement = (type, data) => {
let nodeLinkData;
if (type === "node") {
nodeLinkData = this.utils.nodeInfo(data);
} else {
nodeLinkData = this.utils.linkInfo(data);
}
gui.getNodeLinkInfo(type, nodeLinkData);
gui.sideBar.classList.remove("hidden");
};
onReady: function () {
/*
The map has this property only after the map is rendered,
so we have to put the relevant function in `onLoad` life cycle
Expand Down Expand Up @@ -129,8 +98,6 @@
}
}
});

this.utils.hideLoading();
},
});

Expand Down
35 changes: 1 addition & 34 deletions examples/netjsonmap-plugins.html
Original file line number Diff line number Diff line change
Expand Up @@ -58,38 +58,7 @@
},

// Load related plugins after the map is rendered
onLoad: function () {
const gui = this.utils.getGUI(this);
gui.init();
if (this.config.metadata) {
gui.createAboutContainer(graph);
this.utils.updateMetadata.call(this);
}
if (this.config.switchMode) {
gui.renderModeSelector.onclick = () => {
if (this.config.render === this.utils.mapRender) {
this.config.render = this.utils.graphRender;
this.echarts.dispose();
graph = new NetJSONGraph(this.data, {
...this.config,
});
graph.render();
} else {
this.config.render = this.utils.mapRender;
this.config.render(this.data, this);
}
};
}
this.config.onClickElement = (type, data) => {
let nodeLinkData;
if (type === "node") {
nodeLinkData = this.utils.nodeInfo(data);
} else {
nodeLinkData = this.utils.linkInfo(data);
}
gui.getNodeLinkInfo(type, nodeLinkData);
gui.sideBar.classList.remove("hidden");
};
onReady: function () {
/*
The map has this property only after the map is rendered,
so we have to put the relevant function in `onLoad` life cycle
Expand Down Expand Up @@ -153,8 +122,6 @@
});

L.control.measure({}).addTo(map);

this.utils.hideLoading();
},
});

Expand Down
2 changes: 1 addition & 1 deletion examples/realtime_update/assets/netjsongraph.min.js

Large diffs are not rendered by default.

Loading

0 comments on commit 3be8459

Please sign in to comment.