I am not sure what this panel is called (See attached), but I was wondering how I can change the look and feel of it. I though setting the style and giving a table I attach to the description of my cesiumentity (which displays there) would work but my style:
#customers {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#customers td, #customers th {
border: 1px solid #ddd;
padding: 8px;
}
#customers tr:nth-child(even){background-color: #f2f2f2;}
#customers tr:hover {background-color: #ddd;}
#customers th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #4CAF50;
color: white;
}
``
Did not seem to have an effect on my html code I put in my cesiumentity description:
var desc = "<p> Zone Number: " + json.data[i].zoneNumber + '</p>'
desc += '<table id =\"Customers\"> <tr> <th> name </th> <th> Sensor </th> <th> Country Code </th> <th> Thumbnail </th>'
for(var j=0; j<json.data[i].cesium_entities.length; j++)
{
desc += "<tr>"
desc += "<td>" + json.data[i].cesium_entities[j].name + "</td>"
desc += "<td>" + json.data[i].cesium_entities[j].sensor + "</td>"
desc += "<td>" + json.data[i].cesium_entities[j].country_code + "</td>"
desc += "<td>" + json.data[i].cesium_entities[j].sensor + "</td>"
desc += "<td>" + "<a href=\"" + json.data[i].cesium_entities[j].resource_location + "\"><img src=\"/static/swsite/images/demoThumbnail1.png\" /></td>"
desc += "</tr>";
}
desc += "</table>"
entitycesium.description = desc;
``
So I was curious where I could find the css or what I have to do so I can really fiddle with the look and feel of this window (even widening it or adding diff widgets all together) or what tutorials or demos might show me this. (I wasn’t sure the name so no idea what to google for)
