|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<title>A-Frame 3D Map Flight</title> |
|
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script> |
|
</head> |
|
<body> |
|
<a-scene> |
|
|
|
<a-plane id="map-surface" |
|
height="50" |
|
width="50" |
|
position="0 0 -50" |
|
material="shader:flat;color:#333;src:#map-data"></a-plane> |
|
|
|
|
|
<a-assets> |
|
<a-asset-item id="map-data" src="#map-data-text"></a-asset-item> |
|
<a-text id="map-data-text" value='[ |
|
{"x": -10, "y": 0, "z": -10}, |
|
{"x": 10, "y": 0, "z": -10}, |
|
{"x": 10, "y": 0, "z": 10}, |
|
{"x": -10, "y": 0, "z": 10} |
|
]'></a-text> |
|
</a-assets> |
|
|
|
|
|
<a-entity id="camera" |
|
position="0 1.6 0" |
|
camera |
|
wasd-controls |
|
fly></a-entity> |
|
</a-scene> |
|
</body> |
|
</html> |
|
|
