# Slow draw sphere/circle performance

**URL:** <https://community.cesium.com/t/slow-draw-sphere-circle-performance/41123>\
**Category:** CesiumJS\
**Created:** [June 3, 2025, 11:13am UTC](https://community.cesium.com/t/slow-draw-sphere-circle-performance/41123 "2025-06-03T11:13:35Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![yunusyurtturk](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/yunusyurtturk/32/27882_2.png) [@yunusyurtturk](https://community.cesium.com/u/yunusyurtturk)\
**Post date:** [June 3, 2025, 11:13am UTC](https://community.cesium.com/t/slow-draw-sphere-circle-performance/41123/1 "2025-06-03T11:13:35Z")

</div>

I’m adding **drawing rectangle and sphere entities by mouse**. I’ve already implemented rectangle, which works fine. Similarly, I implemented a sphere (later simplified to an ellipse), but **the drawing performance isn’t satisfying**. When moving the mouse, the ellipsoid can’t be redrawn efficiently.

Here is a sandcastle example.

After opening the sandcastle example, click and hold mouse button, then move it while holding. Why its performance is slow? Any way to try or improve it?  
Refresh or re-run the example if you need retrying  
Bonus: On sandcastle, I’m also getting an exception at the complete event, don’t know why.

> **[Cesium Sandcastle](https://sandcastle.cesium.com/index.html#c=1VjbbuM2EP0VNg8LGTDoLPYtToKmjhdbIGkWuWxfAgS0NLbY0KRAUk68RYD+Rn+vX9KhZMuURTlKNtuLnkRx5nCuhxRjwYwhV1kKGk41ewBNfr+VBJ9YSWN1HlulowUHnOkTJUdqngmw0FuLucem3NC7UogckfJluD0fszloVs3TctwQMzFI2EgVw4bQxhCU3AxQrrEqSAt6xLRVKCpzIYbtImA4k21imiU8N+e4jDYos98QSDB+XM5wbsqEaRqdaXBOjaXldrlZZVtMwNSeqgdnR/3DJyYTgSGZcJlEbqrXWGKuFlDpuUEHHQd/k9VWu8k66KWliHMEHsgIY5fP6VWsAeRVxmIYLzCuK5zILxHMvFywCvFpHQKQbCIgCpRWUQRYChX2qKidkZJWK+HsLHUvlWVFSYQT0BXmWjNpRB2pxXtqwP4ss9yexJYrGdUz1m8Ly/UyA3o2/nh9d3rx6y+tsQ2ju7zuRj6/uLka351ffBm/ELpMfgezbz430pdw82b5Q+J5m/StgNqCoMEF04/DNybsZYBd8vQKE8vkbAD5lEQBCqolapvHMZYow8GsDAgCDEP6LTS3Fnr6D3J0ZdM210ax4PF9Ed5atIrNkWi2rGiz3M3oDOxn1LhkS0+VZspwlzo/YCVE7HnkV/lMqAnQDBEiXKXvz/kgLrM/VBg9osHmWu7cBterVVo0Fkpi2w53p2VVdcVwplmW8phOtZpXmNHGjoAB21URrjWWJNFWUa5jd+BbUCzzoVj/ElOO/R7VtYJeUHR0xm2eQL+TNLNtwvv1T70tERCCZwYOthvMPQbm/Jz9pvTJIzcH5H2/RYTLXSIp8FlqD8h+YA4ekfUSSD7tkJkjPWrOxCaqSihNfzq7GdMHbtMTkaUs2qcfegFllVvBJbrn2LV9voAMLFBXePKoIVQ4m471NoVNw3qHnMi9N3u16JEaltcnL2noCh7rNfn8L7b0YEDmwEyugaRK86+4ATLh9l/LZAyEWTLTKpcJicoycUzYa5hZVPpHLPJ6cz/bWt3bqnNLee0UiGeuNUK8koeCWK/w2rei1eG60It8De5fTQPXSY426ev7XvW2CyXPEncSsimsWemvP/40hD2CefaAQN69C7E3XQG1nB+CsrRGe1Vn+P4OXwi2JsjnwJ5Ce3z1hxPl2XekjBX49z0AeGSxlZBv7PR/eBMdBo1/k+5/CwbozAJdmaBDDN6QFYLnbySIy+J4XxDElGGAVj1GVp33f/iLQC9GTAgyYfE9cacX4h9dsc9JGcH2W6SoUbj9QOx3H0+Cdw7VT/Hm4FKYfivLcqwuzbw7lC/Ft+h2Ly7G7v+W4XFK3+45lFLP+Dd2pbZ/iVfd2EVTLpm4hBgJ7uh4lSq0wSH5GHR9+YLf9/p7h8YuBRyvnfmRzzOlLcm1iCgdWMCo4a5iBpM8vgdLY1Pd5hwOfNXDhC8IT44CvpDYXT3izBQze8W/wu3e8eEA5RuqQmEO5OxiAVqwpRNL3x+flR8ppYcDHIY1rVJiwvQW8t8)**
>
> The Cesium Sandcastle provides an interactive environment for testing Cesium code.

---

<div class="post-metadata">

**Author:** ![yunusyurtturk](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/yunusyurtturk/32/27882_2.png) [@yunusyurtturk](https://community.cesium.com/u/yunusyurtturk)\
**Post date:** [June 3, 2025, 11:49am UTC](https://community.cesium.com/t/slow-draw-sphere-circle-performance/41123/2 "2025-06-03T11:49:12Z")

</div>

Okay after having a short break, I read my code again and asked myself ‘why there are no CallbackProperty used in move handler’  
Appearently, I was updating the entity in an inefficient way.

So the fix is:  
When creating the entity, use CallbackProperty() :

```auto
...
const radiusCallback = new Cesium.CallbackProperty(() => {
    return this._radiusMeters;
}, false);
...
semiMajorAxis: radiusCallback,
semiMinorAxis: radiusCallback,

```

Then in the move handler, update the CallbackProperty:

```auto
...
this._radiusMeters = Cesium.Cartesian3.distance(centerFlat, currentFlat);

```

This is the result:

> **[Cesium Sandcastle](https://sandcastle.cesium.com/index.html#c=1VjbbuM2EP0VNk8y4NIp9i03NHW82AWSTeAk25cAAS2NbTY0KZCUHW8RoB/RL+yXdCjZMiVRWWWT7cVPpjhzOJwzMxwyFswYcp3OQcOZZivQ5Pc7SfAXK2mszmKrdLTkgDN9ouRQLVIBFnpbMfezc27ofSFEjknx57A+H7MFaFbO02LcEDMxSNhJ5cOG0M4QlNwNUK6xKkgLesi0VSgqMyEO20XAcCbbxDRLeGYucBltUGa/IZCg/7ic4dyUCdM0OtXgNjWSltv1bpW6mICpPVMrZ0f1wwcmE4EumXCZRG6q11hioZZQ6rlBBx0Hf5tWVrtNO+jNCxG3EViRIfouW9DrWAPI65TFMFqiXzc4kR8iyLxcshLxaesCkGwiIAqEVh4EGAol9jCPnaGSVivh7Cx0x8qyPCTCBHSFudFMGlFFatk9NWA/yjSzp7HlSkZVxvptbrlZp0DPR+9v7s8uf/3U6tswuuP1eeSLy9vr0f3F5efRC6EL8juYfXvVoC/h5s34w8LzNvRtgNqcoME50/fDKwl7GWAXnr7BxIKcHSCfkihQgipE1es4+hJlOJiNAUGAw5B+S5nbCj39B2t0aVO91kax4PFD7t6Kt/LDkWi2LstmcZrRGdgr1BiztadKU2W4o853WAERezvyo3wm1ARoiggRrtL353wQx+wPJUaPaLCZls8eg9vVSi0aCyUxbQ+fp2UTdflwplk65zGdarUoMaOdHV/nxU0NBsRY1CHMki+glW81zg01uBxmxCBhAsiQCTFh8cOVViloDC07R0UmVmxtcOMsMYHFmpS5uS1U9eyqLxBhKTs+qSdJ4eLAUn6M94vw6gWYqKdHOOlYkkS1hbdBdOBTkfv7XU7EGG3BwhdVtYJ0UmR8xm2WQL+TNLNtwvvVT72aCAjBUwMHdSduKP6IlCBxRE2R5il/hATTejFxrWZmAC0BDNOClIMmgIEFv2C/KX36yM1Bjdp+izyXneXnwGdze0D2A3PwiCdLAsmHZ2QWGL6aM7EjTAml6S/ntyO64nZ+KtI5i/bpu15AWWVWcImecydY+3wOGVigqvDkhWYoJndV0Tt486K4KYteKxm5/82KmFeiCppXjV5SNkt4TIbk6l8snK4E4b0iwxrkikQRLnjZyMNyplUmExIVMXK832vYl+fPe0ydau38asJ2T9bOieolacCRmdYI8coyX8H6hl37VrRuuCr0or0Gj6GmgdjDWiZjiHb09f1d9eoR8klhcGDZQt9p+BHv0nwmt1WPVgoUcVfsv/74s6LuQqlxrq24ECTF9iZkNcuswsLCXV1c01D7Ul7eoiz9jnm6Af++vY2XobUT5JVZ9g8fi4dB498k894i+zpnYNcs7OCDN8zI4NUCs2uc31zyJJsydNAmL8mmBfs/XJDcIYSZTvJu1TUNxO/KMc8351L7A1nUCNx+wPfPdwXB55Tyvr/rFzYtw50sArJ8EfSa7M/5t+huL87H7vLOsI/Rd3sOp9Az/nNkoe2/UJbPkdGUSybGEFuvUUcrHJKPQbcvS/h9r793ZOxawMl2Oz/zRarwFpJpEVE6sIB+w87NDCZZ/ACWxqZ8qjoa+KpHCV8SnhwH9kJi966KM1Pk9pp/gbu9k6MByjdUhUIW5OxyCVqwtROb/3RyXnyklB4NcBjWtErhuaFryH8D)**
>
> The Cesium Sandcastle provides an interactive environment for testing Cesium code.
