# Custom drawing on globe surface
**URL:** https://community.cesium.com/t/custom-drawing-on-globe-surface/2179
**Category:** CesiumJS
**Created:** [March 17, 2015, 6:39pm UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179 "2015-03-17T18:39:58Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@sharth23](https://community.cesium.com/u/sharth23)
#### Post date: [March 17, 2015, 6:39pm UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/1 "2015-03-17T18:39:58Z")
Hi, I would like to know, can i use some webgl code for drawing on earth globe surface?
Something like this:
var ctx = this.canvas.getContext('2d');
var g = ctx.createRadialGradient(x, y, 0, x, y, radius);
var a = 1 / 10;
g.addColorStop(0, 'rgba(255,255,255,' + a + ')');
g.addColorStop(1, 'rgba(255,255,255,0)');
ctx.fillStyle = g;
ctx.fillRect(x - radius, y - radius, radius \* 2, radius \* 2);
---
### Author:  [@Matt\_Amato](https://community.cesium.com/u/Matt_Amato)
#### Post date: [March 17, 2015, 6:51pm UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/2 "2015-03-17T18:51:56Z")
It depends on what you want to do. If you want to draw lines/polygons/shapes on the earth surface, you can do that using the Entity API, see [this tutorial](http://cesiumjs.org/2015/02/02/Visualizing-Spatial-Data/)
If you want to draw custom imagery on a per-tile basis, then you want a custom imagery provider, but I’m guessing that’s not what you want.
You might also be interested in [this example](http://analyticalgraphicsinc.github.io/cesium-google-earth-examples/demos/draw/) for interactive drawing. Code is available here: [https://github.com/AnalyticalGraphicsInc/cesium-google-earth-examples](https://github.com/AnalyticalGraphicsInc/cesium-google-earth-examples)
---
### Author:  [@sharth23](https://community.cesium.com/u/sharth23)
#### Post date: [March 17, 2015, 8:12pm UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/3 "2015-03-17T20:12:06Z")
Thanks for reply. I just want add simple heatmap API for CesiumJS. As I understand it, this can't be done with entities.
---
### Author:  [@Matt\_Amato](https://community.cesium.com/u/Matt_Amato)
#### Post date: [March 17, 2015, 8:16pm UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/4 "2015-03-17T20:16:12Z")
If all you are doing is generating an image and drawing it on the globe, you can absolutely do it with entities by using a polygon or rectangle and assigning the material the generated canvas. I’ve actually been meaning to prototype something like that with heatmap.js for a while.
---
### Author:  [@sharth23](https://community.cesium.com/u/sharth23)
#### Post date: [March 18, 2015, 9:01am UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/5 "2015-03-18T09:01:22Z")
So, how can i get canvas context and globe surface for drawing circle entities with radial gradient?
---
### Author:  [@Matt\_Amato](https://community.cesium.com/u/Matt_Amato)
#### Post date: [March 18, 2015, 3:26pm UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/6 "2015-03-18T15:26:54Z")
Sounds like you want to create your own imagery provider, I just responded to a similar question in this thread: [https://groups.google.com/d/msg/cesium-dev/o\_b3m-gHAZA/tWSkma3syHMJ](https://groups.google.com/d/msg/cesium-dev/o_b3m-gHAZA/tWSkma3syHMJ)
If that’s not what you want, you can just create a canvas out of this air, draw on it, and then assign it as the material for any polygon you want, which is discussed in the tutorial I previously linked to up thread.
---
### Author:  [@sharth23](https://community.cesium.com/u/sharth23)
#### Post date: [March 24, 2015, 7:10pm UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/7 "2015-03-24T19:10:23Z")
Yes, i did my own ImageryProvider. How can i add my class to cesium or rebuild cesium.js with my sources?
---
### Author:  [@Matt\_Amato](https://community.cesium.com/u/Matt_Amato)
#### Post date: [March 26, 2015, 12:10am UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/8 "2015-03-26T00:10:27Z")
There’s no need to rebuild Cesium unless you are working on a standard implementation that you want to submit back to Cesium. You just include your imagery provider with the rest of your application code.
---
### Author:  [@sharth23](https://community.cesium.com/u/sharth23)
#### Post date: [March 26, 2015, 9:47am UTC](https://community.cesium.com/t/custom-drawing-on-globe-surface/2179/9 "2015-03-26T09:47:28Z")
I get "Uncaught SyntaxError: Unexpected token . index.html:1" when i include my imagery provider.
index.html code: [http://pastebin.com/f0su8wfM](http://pastebin.com/f0su8wfM)
HeatmapImageryProvider.js code: [http://pastebin.com/PpRJbR4e](http://pastebin.com/PpRJbR4e)
What i'm doing wrong?