# Change color of polygon from KML

**URL:** https://community.cesium.com/t/change-color-of-polygon-from-kml/5015
**Category:** CesiumJS
**Created:** [January 12, 2017, 3:22pm UTC](https://community.cesium.com/t/change-color-of-polygon-from-kml/5015 "2017-01-12T15:22:34Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![Gerry\_Creighton](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/gerry_creighton/32/2898_2.png) [@Gerry\_Creighton](https://community.cesium.com/u/Gerry_Creighton)
#### Post date: [January 12, 2017, 3:22pm UTC](https://community.cesium.com/t/change-color-of-polygon-from-kml/5015/1 "2017-01-12T15:22:34Z")

</div>

I have a project that I’ve converted from Google Earth to Cesium. I have the following problem and can’t seem to find an answer.  
This project loads a dynamically generated KML file so I don’t have control over the colors.  
I can get to the following polygon and I have a function to show or hide the polygon but I can not change it’s color.

Works:  
outagesLayer.entities.getById(‘GPSJammingInterferenceId’).show = false/true; //depending on check box in the html.

Does not work:  
outagesLayer.entities.getById(‘GPSJammingInterferenceId’).polygon.material = Cesium.Color.RED.withAlpha(0.5);

I’ve tried creating a material and then setting the material of this object but it doesn’t change. Is this possible?

Thanks,

-Gerry

---

<div class="post-metadata">

### Author: ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)
#### Post date: [January 12, 2017, 3:51pm UTC](https://community.cesium.com/t/change-color-of-polygon-from-kml/5015/2 "2017-01-12T15:51:14Z")

</div>

Hi Gerry,

I believe the code you posted should work, so it might be a bug. Could you put together an example to reproduce this in Sandcastle: [http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html](http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html)

By the way, what kind of project are you working on?

Best,

Hannah

---

<div class="post-metadata">

### Author: ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)
#### Post date: [January 12, 2017, 4:13pm UTC](https://community.cesium.com/t/change-color-of-polygon-from-kml/5015/3 "2017-01-12T16:13:26Z")

</div>

This example worked for me:

var kml = ’\<?xml version="1.0" encoding="UTF-8"?\>  
  
  
Polygon.kml  
0  
  
hollow box  
  
  
  
  
-122.366278,37.818844,30  
-122.365248,37.819267,30  
-122.365640,37.819861,30  
-122.366669,37.819429,30  
-122.366278,37.818844,30  
  
  
  
  
  
  
';  
var viewer = new Cesium.Viewer(‘cesiumContainer’);  
var parser = new DOMParser();  
var promise = Cesium.KmlDataSource.load(parser.parseFromString(kml, “text/xml”), {  
camera: viewer.scene.camera,  
canvas: viewer.scene.canvas  
});  
promise.then(function(ds) {  
viewer.dataSources.add(ds);  
ds.entities.getById(‘test’).polygon.material = Cesium.Color.RED;  
viewer.zoomTo(ds.entities);  
});

``

Best,

Hannah
