Cesium Getting Started Eleven: Understanding Entity in Cesium

Introduction to the Entity class

EntityClasses are the core classes in Cesium that describe and present physical objects on Earth. It has a rich set of properties and methods for controlling and customizing the appearance and behavior of geographic entities. EntityObjects can represent various geographical entities, such as points, lines, areas, etc., and have attributes such as position, direction, model, sign, polyline, polygon, etc. By setting these attributes, various types of geographic visualization can be realized. In addition, Entitythe class also provides some other commonly used methods and properties, such as description information, visibility and custom properties. Through the use of Entityclasses, solid objects on the globe can be created and customized in Cesium for complex geographic visualizations and interactions.

The role of Entity in Cesium

Entity is a very important class in Cesium, which provides us with a flexible and powerful way to describe, present and manipulate physical objects on the earth. Through Entity, we can use Cesium's powerful functions and diverse graphic objects to create the following rich and vivid geographic visualization scenarios.

1. Geographic information expression: Entity allows us to express geographic information in a more intuitive and semantic way. By setting the Entity's position, direction, shape, style and other attributes, we can create various types of geographic entities such as points, lines, and areas, and associate them with specific coordinates and visual effects.

2. Visual presentation: Using Entity, we can present geographical entities on the earth in various forms such as graphics, models, signs, etc., so as to realize geographic visualization. Entity provides a wealth of graphic objects, such as Point (Point), Line (Polyline), Surface (Polygon), Model (Model), etc., which allow us to flexibly control the appearance and style of entities.

3. Dynamic update: Entity supports real-time dynamic update, and real-time update of geographical entities can be realized by setting callback functions of properties such as position and direction. In this way, we can change the state of the entity according to real-time data or interactive operations, so as to achieve real-time presentation, animation effects, etc.

4. Interaction and event handling: Entity allows us to set event handlers for geographic entities, such as mouse clicks, hovering, and other events. By listening to these events, we can interact with entities, such as popping up information windows, highlighting selected entities, and performing related operations.

5. Extension and customization: By inheriting the Entity class, we can extend and customize the functions of the entity. You can meet specific needs or implement customized geographic entities by adding new properties, methods, and event handlers.

Common properties of Entity

1. id: A string used to uniquely identify the Entity. You can set a custom ID as needed to facilitate the subsequent search and operation of the Entity.

2. name: The name used to describe the Entity, usually displayed on the map or scene as a label or identifier.

3. position: Describes the location of the Entity. It can be a Cartesian3 object, which represents the three-dimensional position of geographic coordinates, or a callback function, which dynamically updates the position.

4. orientation: Describes the direction of the Entity. It can be a Quaternion object, which represents the rotation direction of the Entity, or a callback function, which dynamically updates the direction.

5. model: Describes the 3D model of the Entity. You can use the ModelGraphics object to set properties such as URI, scaling, and color of the model.

6. billboard: A tag describing the Entity. You can use the BillboardGraphics object to set the image, size, color and other properties of the signage.

7. polyline: A polyline describing the Entity. You can use the PolylineGraphics object to set the position, color, width and other properties of the polyline.

8. polygon: A polygon describing the Entity. You can use the PolygonGraphics object to set the polygon's position, color, transparency and other properties.

9. description: Describe the details of the Entity. Can be plain text or rich text using HTML formatting. Typically used to display an entity's description, attributes, or other relevant information.

10. show: Control the visibility of the Entity. Can be set to true or false to show or hide the Entity.

Use Entity to create points, lines, and surfaces

In Cesium, Entityan object is a visual graphic object that can be used to display various types of entities on the earth, such as points, lines, surfaces, etc. It has various properties that can be used to define the entity's position, shape, style, etc. Commonly used Entitygraphics objects and their properties are as follows:

Commonly used Entity graphic objects and their properties

1. Point:

   • position: The position of the entity. Cesium.Cartesian3.fromDegreesGeolocation can be specified using or other methods.
   • point: It is used to define the style of the point, including pixelSize(pixel size), color(color) and other attributes.

2. Line (Polyline):

   • polyline: Used to define the shape and style of the line. Including positions(point position array), width(width), material(material) and other attributes.

3. Surface (Polygon):

   • polygon: Used to define the shape and style of the face. Including hierarchy(point position array), extrudedHeight(extrusion height), material(material) and other attributes.

4. Model (Model):

   • model: It is used to define the URL of the model, that is, the loaded model file path.
   • position: The position of the model.
   • orientation: The orientation of the model.
   • scale: The scale of the model.
   • minimumPixelSize: The minimum display size of the model.

5. Label (Label):

   • label: Used to define the attributes of the label, including text(text content), font(font), pixelOffset(offset), etc.

How to Create Points, Lines, and Areas

create point

Create a point by configuring the point property in Entity, the code is as follows:

// 创建一个点
const pointEntity = new Cesium.Entity({
  position:Cesium.Cartesian3.fromDegrees( -74.01881302800248,40.69114333714821),
  point:{
    pixelSize:10,
    color:Cesium.Color.RED
  }
})

create line

Create a line by configuring the polyline property in Entity, the code is as follows:

// 创建一个线实体
const lineEntity = new Cesium.Entity({
  polyline: {
    positions: Cesium.Cartesian3.fromDegreesArray([
      -75.61777, 40.03883,
      -80.42087, 25.79065
    ]),
    width: 5,
    material: Cesium.Color.BLUE
  }
})

create surface

Create a surface by configuring the polygon property in Entity, the code is as follows:

// 创建一个面实体
const polygonEntity = new Cesium.Entity({
  polygon: {
    hierarchy: Cesium.Cartesian3.fromDegreesArray([
      -72.0, 40.0,
      -70.0, 35.0,
      -75.0, 30.0
    ]),
    extrudedHeight: 0,
    material: Cesium.Color.GREEN.withAlpha(0.5)
  }
})

Add points, lines, and surfaces to the viewer

To add points, lines, and surfaces to the viewer, we only need to call the viewer.entities.add() method.
The code to add the points, lines, and surfaces created above to the viewer is as follows:

const addEntity = () => {
  viewer.entities.add(pointEntity)
  viewer.entities.add(lineEntity)
  viewer.entities.add(polygonEntity)
}

After the above code is completed, run the program, refresh the browser, and see the effect

Modify the appearance and style of Entity

To control Entitythe appearance and style of an object, you can use Entitythe object's properties to define its appearance characteristics

Point (Point) appearance style

• pixelSize: Sets the point size in pixels.
• color: Set the color of the point.
• outlineColor: Set the border color of the point.
• outlineWidth: Set the border width of points.
  Add an appearance style to the entity of the above point, the code is as follows

// 创建一个点
const pointEntity = new Cesium.Entity({
  position:Cesium.Cartesian3.fromDegrees( -74.01881302800248,40.69114333714821),
  point:{
    pixelSize:10,
    color:Cesium.Color.RED,
    outlineColor: Cesium.Color.BLACK,
    outlineWidth: 1
  }
})

The appearance style of the line (Polyline)

• width: Set the width of the line.
• material: Set the material of the line, you can use Cesium.Materialthe provided material types, such as Cesium.ColorMaterialProperty, , Cesium.ImageMaterialPropertyetc.
  Add an appearance style to the entity of the above line, the code is as follows

// 创建一个线实体
const lineEntity = new Cesium.Entity({
  polyline: {
    positions: Cesium.Cartesian3.fromDegreesArray([
      -75.61777, 40.03883,
      -80.42087, 25.79065
    ]),
    width: 5,
    material: new Cesium.PolylineOutlineMaterialProperty({
      color: Cesium.Color.GREEN,
      outlineWidth: 1,
      outlineColor: Cesium.Color.BLACK
    })
  }
})

Surface (Polygon) Appearance Style

• material: Set the material of the surface, you can use Cesium.Materialthe provided material types, such as Cesium.ColorMaterialProperty, , Cesium.ImageMaterialPropertyetc.
  Add an appearance style to the entity of the surface above, the code is as follows

// 创建一个面实体
const polygonEntity = new Cesium.Entity({
  polygon: {
    hierarchy: Cesium.Cartesian3.fromDegreesArray([
      -72.0, 40.0,
      -70.0, 35.0,
      -75.0, 30.0
    ]),
    extrudedHeight: 0,
    material: Cesium.Color.GREEN.withAlpha(0.5)
  }
})

The Entity class in Cesium provides powerful functionality for creating, manipulating, and visualizing objects in Earth space. By using the Entity class, we can create entity objects such as various points, lines, surfaces, and icons, and interact, update, and manage them.

Here is just an introduction to the simple application of the Entity class. You can explore more functions by yourself. That’s it for today. If you have any questions, leave a message in the comment area. If you like it, please like, follow and add to favorites!