# Loading an Image to GeoJsonDataSource

**URL:** <https://community.cesium.com/t/loading-an-image-to-geojsondatasource/1390>\
**Category:** CesiumJS\
**Created:** [August 4, 2014, 5:09pm UTC](https://community.cesium.com/t/loading-an-image-to-geojsondatasource/1390 "2014-08-04T17:09:03Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![njbandit](https://avatars.discourse-cdn.com/v4/letter/n/b3f665/32.png) [@njbandit](https://community.cesium.com/u/njbandit)\
**Post date:** [August 4, 2014, 5:09pm UTC](https://community.cesium.com/t/loading-an-image-to-geojsondatasource/1390/1 "2014-08-04T17:09:03Z")

</div>

I am having trouble with my project due to the new changes. I used to be able to load an image to a DynamicBillBoard and make my defaultPoint loaded from an GeoJsonDataSource. I looked at the new GeoJsonDataSource tutorial in Sandcastle, but wasn't able to find anything useful. Please Help. The old way:

require(['Cesium'], function(Cesium){  
&nbsp;&nbsp;&nbsp;"use strict";

&nbsp;&nbsp;var viewer = new Cesium.Viewer(‘cesiumContainer’);  
&nbsp;&nbsp;var geojsonSource = new Cesium.GeoJsonDataSource(“geojson”);  
&nbsp;&nbsp;  
var url = ‘[http://localhost:8080/GeoJSONtoCesium/GeoJSON/posRpt.geojson](http://localhost:8080/GeoJSONtoCesium/GeoJSON/posRpt.geojson)’;  
var defaultPoint = geojsonSource.defaultPoint;  
defaultPoint.point = undefined;  
var billboard = new Cesium.DynamicBillboard();  
billboard.image = new Cesium.ConstantProperty(‘[http://localhost:8080/GeoJSONtoCesium/GeoJSON/symbol.png](http://localhost:8080/GeoJSONtoCesium/GeoJSON/symbol.png)’);  
defaultPoint.billboard = billboard;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;geojsonSource.loadUrl(url).then(function(){  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return geojsonSource;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});  
&nbsp;&nbsp;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;viewer.dataSources.add(geojsonSource);  
Sandcastle.finishedLoading();  
});

---

<div class="post-metadata">

**Author:** ![Matt\_Amato](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/matt_amato/32/1993_2.png) [@Matt\_Amato](https://community.cesium.com/u/Matt_Amato)\
**Post date:** [August 5, 2014, 2:09am UTC](https://community.cesium.com/t/loading-an-image-to-geojsondatasource/1390/2 "2014-08-05T02:09:19Z")

</div>

We got rid of these properties in an attempt to streamline GeoJSON loading and provide better per-entity customization. I’ve re-written your code to work with 1.0. A similar example (works with polygons, not points) is available here: [http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=GeoJSON%20and%20TopoJSON.html](http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=GeoJSON%20and%20TopoJSON.html)

var viewer = new Cesium.Viewer(‘cesiumContainer’);

var geojsonSource = new Cesium.GeoJsonDataSource(“geojson”);

var billboard = new Cesium.BillboardGraphics();

billboard.image = new Cesium.ConstantProperty('[http://localhost:8080/GeoJSONtoCesium/GeoJSON/symbol.png’](http://localhost:8080/GeoJSONtoCesium/GeoJSON/symbol.png'));

var url = ‘[http://localhost:8080/GeoJSONtoCesium/GeoJSON/posRpt.geojson](http://localhost:8080/GeoJSONtoCesium/GeoJSON/posRpt.geojson)’;

geojsonSource.loadUrl(url).then(function() {

var entities = dataSource.entities.entities;

for (var i = 0; i \< entities.length; i++) {

var entity = entities[i];

entity.point = undefined;

entity.billboard = billboard;

}

});

```
viewer.dataSources.add(geojsonSource);

```

Hope that helps,

Matt