Information Summary Widget - Grouping Feature Classes

327
0
11-18-2019 10:48 AM
KevinThompson
New Contributor III

Hello All,

I am implementing an application in Web Appbuilder and am looking for a little assistance from some more senior developers with implementing some changes to the Information Summary Widget.

 

My clients have asked for the ability to have the widget group features.

In the below example you can see there are different types of project for Water, Wastewater and Roadways and they are stored in two different types of feature class.

 

Unfortunately to my knowledge there are no configuration settings to allow for this within the widget, so I have made some attempts at creating a facade to achieve this goal without overhauling the entire Widget.js file.

 

Here is the before

 

 

I have written this basic code posted below. In the Chrome console I can run the pieces to perform the intended result.The issue arises when I go to implement the code into the Widget.js file where things go poorly.

In debugging the code of the widget to attempt to understand what is happening I have noticed that it passes through each feature class four times when refreshing the display, and this is where I am unsure where to implement my code to be performed after this is complete?

//get the new sum from the first two layers

var number1 = parseInt(document.getElementById("recNum_CapitalSearch_4529_4599_1271").innerHTML.replace(",",""))

var number2 = parseInt(document.getElementById("recNum_CapitalSearch_9364_4752").innerHTML.replace(",",""))

var number3 = number1 + number2

 

//sets the new sum of values

document.getElementById("recNum_CapitalSearch_4529_4599_1271").innerHTML=number3

 

//combine lists

var table1 = document.getElementById("legend_CapitalSearch_4529_4599_1271")

var table2 = document.getElementById("legend_CapitalSearch_9364_4752")

var table3 = table1.innerHTML + table2.innerHTML

 

//sets the new values for the list

document.getElementById("legend_CapitalSearch_4529_4599_1271").innerHTML=table3

 

//hides the element not wanted

document.getElementById("rec_CapitalSearch_9364_4752").style.display="none"

 

Here is the code working for a single pass

Thank you for reading!

Kevin

Tags (1)
0 Kudos
0 Replies