Applying HTML Markup or CSS rule to arrayUtils Attributes in InfoTemplate

BruceGreen — Sat, 11 Dec 2021 09:09:00 GMT

Can you please let me know how I can apply Style or append HTML markup into infoTemplate like this

        var symbol = new PictureMarkerSymbol("img/direqyb6T.png", 32, 32);
        layer2 = new GraphicsLayer();
        var infoTemplate = new InfoTemplate("Project Details", "${*}");
        arrayUtils.forEach(points, function (project) {
            att = {
                    "Project Id": project.ProjectID,
                    "Longitude": project.Longitude,
                    "Latitude": project.Latitude
            };
            mp = new Point(project.Longitude, project.Latitude);
            var projGra = new Graphic(mp, symbol, att);
            layer2.add(projGra);
        });

        layer2.setInfoTemplate(infoTemplate);
        map.addLayer(layer2);

this code is generating a popup like below

but I need to show the information in a HTML table or apply some css rules?

Thanks

Re: Applying HTML Markup or CSS rule to arrayUtils Attributes in InfoTemplate

ChenLi2 — Tue, 08 Sep 2015 21:18:12 GMT

Hi Behrouz,

I think you should be able to customize your infotemplate using html like this:

var content = "Status: ${STATUS}" +
" Cummulative Gas: ${CUMM_GAS} MCF" +
" Total Acres: ${APPROXACRE}" +
" Avg. Field Depth: ${AVG_DEPTH} meters";
var infoTemplate = new InfoTemplate("${FIELD_NAME}", content);

for more details, please check here:

Format info window content | Guide | ArcGIS API for JavaScript

topic Applying HTML Markup or CSS rule to arrayUtils Attributes in InfoTemplate in ArcGIS JavaScript Maps SDK Questions

Applying HTML Markup or CSS rule to arrayUtils Attributes in InfoTemplate

Re: Applying HTML Markup or CSS rule to arrayUtils Attributes in InfoTemplate