979 lines
33 KiB
JavaScript
Executable File
979 lines
33 KiB
JavaScript
Executable File
#!/usr/bin/env node
|
|
|
|
const fs = require("fs");
|
|
const path = require("path");
|
|
const { spawnSync } = require("child_process");
|
|
|
|
const repoRoot = path.resolve(__dirname, "..");
|
|
const args = parseArgs(process.argv.slice(2));
|
|
const configPath = path.resolve(
|
|
args.config || path.join(repoRoot, "config", "areas", "nantaizi-lake-innovation-valley.json"),
|
|
);
|
|
const area = normalizeAreaConfig(readJson(configPath));
|
|
const requestedStages = args.stages
|
|
? splitList(args.stages)
|
|
: null;
|
|
const stages = resolveStages(area.stages, requestedStages);
|
|
|
|
console.log(`Area: ${area.id}`);
|
|
console.log(`Config: ${configPath}`);
|
|
console.log(`Output: ${area.outputs.areaDir}`);
|
|
|
|
if (stages.intermediates) {
|
|
buildIntermediates(area);
|
|
}
|
|
if (stages.blender) {
|
|
buildBlenderScene(area);
|
|
}
|
|
if (stages.cesium) {
|
|
exportCesium(area);
|
|
}
|
|
if (stages.preview) {
|
|
writeCesiumPreview(area);
|
|
}
|
|
|
|
console.log("Done.");
|
|
|
|
function parseArgs(argv) {
|
|
const out = {};
|
|
for (let i = 0; i < argv.length; i += 1) {
|
|
const arg = argv[i];
|
|
if (!arg.startsWith("--")) continue;
|
|
const key = arg.slice(2).replace(/-([a-z])/g, (_, c) => c.toUpperCase());
|
|
const next = argv[i + 1];
|
|
if (!next || next.startsWith("--")) {
|
|
out[key] = "true";
|
|
} else {
|
|
out[key] = next;
|
|
i += 1;
|
|
}
|
|
}
|
|
return out;
|
|
}
|
|
|
|
function readJson(file) {
|
|
if (!fs.existsSync(file)) {
|
|
throw new Error(`Config file not found: ${file}`);
|
|
}
|
|
return JSON.parse(fs.readFileSync(file, "utf8"));
|
|
}
|
|
|
|
function normalizeAreaConfig(raw) {
|
|
const id = requireText(raw.id, "id");
|
|
const input = path.resolve(requireText(raw.input, "input"));
|
|
if (!fs.existsSync(input)) {
|
|
throw new Error(`Input OSM XML not found: ${input}`);
|
|
}
|
|
|
|
const outputRoot = path.resolve(raw.outputRoot || path.join(repoRoot, "outputs"));
|
|
const outputOverrides = raw.outputs || {};
|
|
const areaDir = path.resolve(outputOverrides.areaDir || path.join(outputRoot, id));
|
|
const fileStem = outputOverrides.fileStem || id;
|
|
const outputs = {
|
|
areaDir,
|
|
geojsonDir: path.resolve(outputOverrides.geojsonDir || path.join(areaDir, "osm2streets_web_out")),
|
|
gpkg: path.resolve(outputOverrides.gpkg || path.join(areaDir, `${fileStem}.gpkg`)),
|
|
qgisProject: path.resolve(outputOverrides.qgisProject || path.join(areaDir, `${fileStem}.qgz`)),
|
|
qgisPreview: path.resolve(outputOverrides.qgisPreview || path.join(areaDir, `${fileStem}-preview.png`)),
|
|
blend: path.resolve(outputOverrides.blend || path.join(areaDir, `${fileStem}.blend`)),
|
|
render: path.resolve(outputOverrides.render || path.join(areaDir, `${fileStem}.png`)),
|
|
glb: path.resolve(outputOverrides.glb || path.join(areaDir, `${fileStem}.glb`)),
|
|
metadata: path.resolve(outputOverrides.metadata || path.join(areaDir, `${fileStem}.json`)),
|
|
cesiumPreview: path.resolve(
|
|
outputOverrides.cesiumPreview || path.join(areaDir, `${fileStem}-cesium-preview.html`),
|
|
),
|
|
vehicleRoute: path.resolve(outputOverrides.vehicleRoute || path.join(areaDir, `${fileStem}-vehicle-route.json`)),
|
|
vehicleModel: path.resolve(outputOverrides.vehicleModel || path.join(areaDir, `${fileStem}-vehicle-car.gltf`)),
|
|
pipelineDir: path.resolve(outputOverrides.pipelineDir || path.join(areaDir, "_pipeline")),
|
|
};
|
|
|
|
return {
|
|
id,
|
|
input,
|
|
outputRoot,
|
|
qgisApp: raw.qgisApp || "/Applications/QGIS.app",
|
|
blenderApp: raw.blenderApp || "/Applications/Blender.app",
|
|
stages: {
|
|
intermediates: raw.stages?.intermediates ?? raw.stages?.qgis ?? true,
|
|
blender: raw.stages?.blender ?? true,
|
|
cesium: raw.stages?.cesium ?? true,
|
|
preview: false,
|
|
},
|
|
qgis: {
|
|
arrowScale: raw.qgis?.arrowScale ?? raw.arrowScale ?? 0.8,
|
|
clipPad: raw.qgis?.clipPad ?? raw.clipPad ?? 0.002,
|
|
canvasPad: raw.qgis?.canvasPad ?? raw.canvasPad ?? 0.001,
|
|
previewPad: raw.qgis?.previewPad ?? raw.previewPad ?? 0.0007,
|
|
canvasExtent: raw.qgis?.canvasExtent ?? raw.canvasExtent ?? null,
|
|
previewExtent: raw.qgis?.previewExtent ?? raw.previewExtent ?? null,
|
|
layerPrefix: raw.qgis?.layerPrefix ?? raw.layerPrefix ?? "osm2streets",
|
|
},
|
|
osm2streets: raw.osm2streets || {
|
|
debug_each_step: false,
|
|
dual_carriageway_experiment: false,
|
|
sidepath_zipping_experiment: false,
|
|
inferred_sidewalks: true,
|
|
osm2lanes: true,
|
|
},
|
|
blender: {
|
|
treeStyle: raw.blender?.treeStyle || "natural",
|
|
officeOverrides: raw.blender?.officeOverrides || raw.blender?.office_overrides || "",
|
|
},
|
|
outputs,
|
|
};
|
|
}
|
|
|
|
function requireText(value, key) {
|
|
if (typeof value !== "string" || value.trim() === "") {
|
|
throw new Error(`Missing config key: ${key}`);
|
|
}
|
|
return value;
|
|
}
|
|
|
|
function splitList(value) {
|
|
return String(value)
|
|
.split(",")
|
|
.map((item) => item.trim())
|
|
.filter(Boolean);
|
|
}
|
|
|
|
function resolveStages(defaults, requested) {
|
|
if (!requested) return defaults;
|
|
const aliases = {
|
|
all: ["intermediates", "blender", "cesium"],
|
|
qgis: ["intermediates"],
|
|
osm2streets: ["intermediates"],
|
|
geojson: ["intermediates"],
|
|
intermediate: ["intermediates"],
|
|
intermediates: ["intermediates"],
|
|
blender: ["blender"],
|
|
scene: ["blender"],
|
|
cesium: ["cesium"],
|
|
glb: ["cesium"],
|
|
preview: ["preview"],
|
|
html: ["preview"],
|
|
cesiumPreview: ["preview"],
|
|
};
|
|
const out = { intermediates: false, blender: false, cesium: false, preview: false };
|
|
for (const stage of requested) {
|
|
const mapped = aliases[stage];
|
|
if (!mapped) {
|
|
throw new Error(`Unknown stage '${stage}'. Use intermediates, blender, cesium, preview, or all.`);
|
|
}
|
|
for (const key of mapped) out[key] = true;
|
|
}
|
|
return out;
|
|
}
|
|
|
|
function buildIntermediates(area) {
|
|
fs.mkdirSync(area.outputs.pipelineDir, { recursive: true });
|
|
const derivedConfig = {
|
|
qgisApp: area.qgisApp,
|
|
input: area.input,
|
|
outDir: area.outputs.geojsonDir,
|
|
gpkg: area.outputs.gpkg,
|
|
project: area.outputs.qgisProject,
|
|
preview: area.outputs.qgisPreview,
|
|
arrowScale: area.qgis.arrowScale,
|
|
clipPad: area.qgis.clipPad,
|
|
canvasPad: area.qgis.canvasPad,
|
|
previewPad: area.qgis.previewPad,
|
|
canvasExtent: area.qgis.canvasExtent,
|
|
previewExtent: area.qgis.previewExtent,
|
|
layerPrefix: area.qgis.layerPrefix,
|
|
osm2streets: area.osm2streets,
|
|
};
|
|
const derivedConfigPath = path.join(area.outputs.pipelineDir, "osm2streets-qgis.config.json");
|
|
fs.writeFileSync(derivedConfigPath, `${JSON.stringify(derivedConfig, null, 2)}\n`);
|
|
|
|
console.log("Stage: intermediates (osm2streets GeoJSON + QGIS)");
|
|
runCommand(process.execPath, [
|
|
path.join(repoRoot, "scripts", "build-osm2streets-qgis.js"),
|
|
"--config",
|
|
derivedConfigPath,
|
|
], "intermediates");
|
|
}
|
|
|
|
function buildBlenderScene(area) {
|
|
ensureFile(blenderExecutable(area), "Blender executable");
|
|
ensureFile(path.join(repoRoot, "blender", "generate_scene.py"), "Blender scene generator");
|
|
fs.mkdirSync(path.dirname(area.outputs.blend), { recursive: true });
|
|
fs.mkdirSync(path.dirname(area.outputs.render), { recursive: true });
|
|
|
|
const blenderArgs = [
|
|
"--background",
|
|
"--factory-startup",
|
|
"--python",
|
|
path.join(repoRoot, "blender", "generate_scene.py"),
|
|
"--",
|
|
"--osm",
|
|
area.input,
|
|
"--geojson",
|
|
area.outputs.geojsonDir,
|
|
"--output",
|
|
area.outputs.blend,
|
|
"--render",
|
|
area.outputs.render,
|
|
"--tree-style",
|
|
area.blender.treeStyle,
|
|
];
|
|
if (area.blender.officeOverrides) {
|
|
blenderArgs.push("--office-overrides", area.blender.officeOverrides);
|
|
}
|
|
|
|
console.log("Stage: blender");
|
|
runCommand(blenderExecutable(area), blenderArgs, "blender");
|
|
}
|
|
|
|
function exportCesium(area) {
|
|
ensureFile(blenderExecutable(area), "Blender executable");
|
|
ensureFile(area.outputs.blend, "Blend scene");
|
|
ensureFile(path.join(repoRoot, "blender", "export_cesium.py"), "Cesium exporter");
|
|
fs.mkdirSync(path.dirname(area.outputs.glb), { recursive: true });
|
|
fs.mkdirSync(path.dirname(area.outputs.metadata), { recursive: true });
|
|
|
|
console.log("Stage: cesium");
|
|
runCommand(blenderExecutable(area), [
|
|
"--background",
|
|
"--python",
|
|
path.join(repoRoot, "blender", "export_cesium.py"),
|
|
"--",
|
|
"--blend",
|
|
area.outputs.blend,
|
|
"--glb",
|
|
area.outputs.glb,
|
|
"--metadata",
|
|
area.outputs.metadata,
|
|
], "cesium");
|
|
writeCesiumPreview(area);
|
|
}
|
|
|
|
function blenderExecutable(area) {
|
|
return path.join(area.blenderApp, "Contents", "MacOS", "Blender");
|
|
}
|
|
|
|
function ensureFile(file, label) {
|
|
if (!fs.existsSync(file)) {
|
|
throw new Error(`${label} not found: ${file}`);
|
|
}
|
|
}
|
|
|
|
function runCommand(command, commandArgs, stage) {
|
|
const result = spawnSync(command, commandArgs, { stdio: "inherit" });
|
|
if (result.error) {
|
|
throw result.error;
|
|
}
|
|
if (result.status !== 0) {
|
|
const signal = result.signal ? ` signal=${result.signal}` : "";
|
|
throw new Error(`Stage '${stage}' failed with status=${result.status}${signal}`);
|
|
}
|
|
}
|
|
|
|
function writeCesiumPreview(area) {
|
|
ensureFile(area.outputs.glb, "Cesium GLB");
|
|
ensureFile(area.outputs.metadata, "Cesium metadata");
|
|
const htmlPath = area.outputs.cesiumPreview;
|
|
fs.mkdirSync(path.dirname(htmlPath), { recursive: true });
|
|
writeVehicleRoute(area);
|
|
writeVehicleModel(area);
|
|
const glbName = path.basename(area.outputs.glb);
|
|
const metadataName = path.basename(area.outputs.metadata);
|
|
const routeName = path.basename(area.outputs.vehicleRoute);
|
|
const vehicleModelName = path.basename(area.outputs.vehicleModel);
|
|
fs.writeFileSync(htmlPath, cesiumPreviewHtml(glbName, metadataName, routeName, vehicleModelName, area.id));
|
|
console.log(`Cesium preview: ${htmlPath}`);
|
|
}
|
|
|
|
function writeVehicleRoute(area) {
|
|
const route = buildVehicleRoute(area.input);
|
|
fs.mkdirSync(path.dirname(area.outputs.vehicleRoute), { recursive: true });
|
|
fs.writeFileSync(area.outputs.vehicleRoute, `${JSON.stringify(route, null, 2)}\n`);
|
|
console.log(`Vehicle route: ${area.outputs.vehicleRoute}`);
|
|
}
|
|
|
|
function writeVehicleModel(area) {
|
|
const gltf = makeVehicleGltf();
|
|
fs.mkdirSync(path.dirname(area.outputs.vehicleModel), { recursive: true });
|
|
fs.writeFileSync(area.outputs.vehicleModel, `${JSON.stringify(gltf, null, 2)}\n`);
|
|
console.log(`Vehicle model: ${area.outputs.vehicleModel}`);
|
|
}
|
|
|
|
function buildVehicleRoute(osmPath) {
|
|
const xml = fs.readFileSync(osmPath, "utf8");
|
|
const bounds = osmBounds(xml);
|
|
const nodes = new Map();
|
|
for (const match of xml.matchAll(/<node\b([^>]*)>/g)) {
|
|
const attrs = xmlAttrs(match[1]);
|
|
if (!attrs.id || attrs.lon === undefined || attrs.lat === undefined) continue;
|
|
nodes.set(attrs.id, [Number(attrs.lon), Number(attrs.lat)]);
|
|
}
|
|
|
|
const segments = [];
|
|
for (const match of xml.matchAll(/<way\b([^>]*)>([\s\S]*?)<\/way>/g)) {
|
|
const attrs = xmlAttrs(match[1]);
|
|
const body = match[2];
|
|
const tags = {};
|
|
for (const tagMatch of body.matchAll(/<tag\b([^>]*)\/?>/g)) {
|
|
const tag = xmlAttrs(tagMatch[1]);
|
|
if (tag.k) tags[tag.k] = tag.v || "";
|
|
}
|
|
if (!isCruiseHighway(tags)) continue;
|
|
const coords = [];
|
|
for (const ndMatch of body.matchAll(/<nd\b([^>]*)\/?>/g)) {
|
|
const nd = xmlAttrs(ndMatch[1]);
|
|
const coord = nodes.get(nd.ref);
|
|
if (coord) coords.push(coord);
|
|
}
|
|
const runs = splitInBounds(compactCoords(coords), bounds);
|
|
let runIndex = 0;
|
|
for (const run of runs) {
|
|
const lengthMeters = routeLength(run);
|
|
if (lengthMeters < 20) continue;
|
|
runIndex += 1;
|
|
const laneOffsetMeters = 1.3;
|
|
const shiftedRun = offsetPolylineRight(run, laneOffsetMeters);
|
|
segments.push({
|
|
id: runIndex === 1 ? (attrs.id || `way-${segments.length + 1}`) : `${attrs.id || "way"}-${runIndex}`,
|
|
name: tags.name || tags.highway || "road",
|
|
highway: tags.highway || "",
|
|
oneWay: tags.oneway || "",
|
|
lengthMeters,
|
|
laneOffsetMeters,
|
|
coordinates: shiftedRun,
|
|
centerlineCoordinates: run,
|
|
});
|
|
}
|
|
}
|
|
segments.sort((a, b) => b.lengthMeters - a.lengthMeters);
|
|
return {
|
|
source: osmPath,
|
|
bounds,
|
|
generatedAt: new Date().toISOString(),
|
|
speedMetersPerSecond: 8.0,
|
|
loop: true,
|
|
segments,
|
|
};
|
|
}
|
|
|
|
function osmBounds(xml) {
|
|
const match = xml.match(/<bounds\b([^>]*)\/?>/);
|
|
if (!match) return null;
|
|
const attrs = xmlAttrs(match[1]);
|
|
const bounds = {
|
|
minLon: Number(attrs.minlon),
|
|
minLat: Number(attrs.minlat),
|
|
maxLon: Number(attrs.maxlon),
|
|
maxLat: Number(attrs.maxlat),
|
|
};
|
|
return Object.values(bounds).every(Number.isFinite) ? bounds : null;
|
|
}
|
|
|
|
function xmlAttrs(text) {
|
|
const attrs = {};
|
|
for (const match of text.matchAll(/([:\w-]+)\s*=\s*("([^"]*)"|'([^']*)')/g)) {
|
|
attrs[match[1]] = match[3] !== undefined ? match[3] : match[4];
|
|
}
|
|
return attrs;
|
|
}
|
|
|
|
function isCruiseHighway(tags) {
|
|
const highway = tags.highway || "";
|
|
if (!highway) return false;
|
|
if (tags.area === "yes") return false;
|
|
const blocked = new Set([
|
|
"footway", "path", "pedestrian", "steps", "cycleway", "service", "track",
|
|
"bridleway", "corridor", "elevator", "platform", "construction",
|
|
]);
|
|
return !blocked.has(highway);
|
|
}
|
|
|
|
function compactCoords(coords) {
|
|
const out = [];
|
|
for (const coord of coords) {
|
|
const last = out[out.length - 1];
|
|
if (!last || last[0] !== coord[0] || last[1] !== coord[1]) {
|
|
out.push(coord);
|
|
}
|
|
}
|
|
return out;
|
|
}
|
|
|
|
function offsetPolylineRight(coords, offsetMeters) {
|
|
if (coords.length < 2 || offsetMeters === 0) return coords;
|
|
const refLat = coords.reduce((sum, coord) => sum + coord[1], 0) / coords.length;
|
|
const metersPerLat = 111320.0;
|
|
const metersPerLon = 111320.0 * Math.cos(degreesToRadians(refLat));
|
|
const points = coords.map((coord) => ({
|
|
x: coord[0] * metersPerLon,
|
|
y: coord[1] * metersPerLat,
|
|
lon: coord[0],
|
|
lat: coord[1],
|
|
}));
|
|
return points.map((point, index) => {
|
|
const prev = points[Math.max(0, index - 1)];
|
|
const next = points[Math.min(points.length - 1, index + 1)];
|
|
let dx = next.x - prev.x;
|
|
let dy = next.y - prev.y;
|
|
const length = Math.hypot(dx, dy);
|
|
if (length < 0.001) return [point.lon, point.lat];
|
|
dx /= length;
|
|
dy /= length;
|
|
const rightX = dy;
|
|
const rightY = -dx;
|
|
return [
|
|
(point.x + rightX * offsetMeters) / metersPerLon,
|
|
(point.y + rightY * offsetMeters) / metersPerLat,
|
|
];
|
|
});
|
|
}
|
|
|
|
function splitInBounds(coords, bounds) {
|
|
if (!bounds) return [coords];
|
|
const runs = [];
|
|
let current = [];
|
|
for (const coord of coords) {
|
|
if (insideBounds(coord, bounds)) {
|
|
current.push(coord);
|
|
} else if (current.length) {
|
|
if (current.length >= 2) runs.push(current);
|
|
current = [];
|
|
}
|
|
}
|
|
if (current.length >= 2) runs.push(current);
|
|
return runs;
|
|
}
|
|
|
|
function insideBounds(coord, bounds) {
|
|
const pad = 0.00002;
|
|
return (
|
|
coord[0] >= bounds.minLon - pad &&
|
|
coord[0] <= bounds.maxLon + pad &&
|
|
coord[1] >= bounds.minLat - pad &&
|
|
coord[1] <= bounds.maxLat + pad
|
|
);
|
|
}
|
|
|
|
function routeLength(coords) {
|
|
let total = 0;
|
|
for (let i = 1; i < coords.length; i += 1) {
|
|
total += haversineMeters(coords[i - 1], coords[i]);
|
|
}
|
|
return total;
|
|
}
|
|
|
|
function haversineMeters(a, b) {
|
|
const radius = 6371008.8;
|
|
const lat1 = degreesToRadians(a[1]);
|
|
const lat2 = degreesToRadians(b[1]);
|
|
const dLat = degreesToRadians(b[1] - a[1]);
|
|
const dLon = degreesToRadians(b[0] - a[0]);
|
|
const sinLat = Math.sin(dLat / 2);
|
|
const sinLon = Math.sin(dLon / 2);
|
|
const h = sinLat * sinLat + Math.cos(lat1) * Math.cos(lat2) * sinLon * sinLon;
|
|
return 2 * radius * Math.asin(Math.min(1, Math.sqrt(h)));
|
|
}
|
|
|
|
function degreesToRadians(value) {
|
|
return value * Math.PI / 180;
|
|
}
|
|
|
|
function makeVehicleGltf() {
|
|
const meshes = [];
|
|
const nodes = [];
|
|
const bufferParts = [];
|
|
const bufferViews = [];
|
|
const accessors = [];
|
|
|
|
function align4(bytes) {
|
|
while (bytes.length % 4 !== 0) bytes.push(0);
|
|
}
|
|
|
|
function addBufferView(bytes, target) {
|
|
align4(bufferParts);
|
|
const offset = bufferParts.length;
|
|
bufferParts.push(...bytes);
|
|
const view = { buffer: 0, byteOffset: offset, byteLength: bytes.length };
|
|
if (target) view.target = target;
|
|
bufferViews.push(view);
|
|
return bufferViews.length - 1;
|
|
}
|
|
|
|
function floatBytes(values) {
|
|
const buffer = Buffer.alloc(values.length * 4);
|
|
values.forEach((value, index) => buffer.writeFloatLE(value, index * 4));
|
|
return Array.from(buffer);
|
|
}
|
|
|
|
function ushortBytes(values) {
|
|
const buffer = Buffer.alloc(values.length * 2);
|
|
values.forEach((value, index) => buffer.writeUInt16LE(value, index * 2));
|
|
return Array.from(buffer);
|
|
}
|
|
|
|
function addAccessor(bufferView, componentType, count, type, min, max) {
|
|
const accessor = { bufferView, componentType, count, type };
|
|
if (min) accessor.min = min;
|
|
if (max) accessor.max = max;
|
|
accessors.push(accessor);
|
|
return accessors.length - 1;
|
|
}
|
|
|
|
function addMesh(name, geometry, material) {
|
|
const positionView = addBufferView(floatBytes(geometry.positions), 34962);
|
|
const indexView = addBufferView(ushortBytes(geometry.indices), 34963);
|
|
const positionAccessor = addAccessor(
|
|
positionView,
|
|
5126,
|
|
geometry.positions.length / 3,
|
|
"VEC3",
|
|
geometry.min,
|
|
geometry.max,
|
|
);
|
|
const indexAccessor = addAccessor(indexView, 5123, geometry.indices.length, "SCALAR");
|
|
meshes.push({
|
|
name,
|
|
primitives: [{
|
|
attributes: { POSITION: positionAccessor },
|
|
indices: indexAccessor,
|
|
material,
|
|
}],
|
|
});
|
|
nodes.push({ name, mesh: meshes.length - 1 });
|
|
}
|
|
|
|
addMesh("body", cuboid(0, 0, 0.72, 4.6, 1.9, 0.9), 0);
|
|
addMesh("hood", cuboid(1.35, 0, 1.1, 1.25, 1.74, 0.38), 0);
|
|
addMesh("cabin", cuboid(-0.55, 0, 1.42, 1.75, 1.55, 0.82), 1);
|
|
addMesh("rear", cuboid(-1.65, 0, 1.08, 0.95, 1.78, 0.42), 0);
|
|
addMesh("front_windshield", cuboid(0.28, 0, 1.58, 0.12, 1.42, 0.58), 2);
|
|
addMesh("left_window", cuboid(-0.55, -0.82, 1.52, 1.25, 0.08, 0.48), 2);
|
|
addMesh("right_window", cuboid(-0.55, 0.82, 1.52, 1.25, 0.08, 0.48), 2);
|
|
for (const x of [-1.55, 1.45]) {
|
|
for (const y of [-1.02, 1.02]) {
|
|
addMesh(`wheel_${x}_${y}`, cylinderY(x, y, 0.46, 0.38, 0.32, 16), 3);
|
|
addMesh(`hub_${x}_${y}`, cylinderY(x, y, 0.46, 0.2, 0.34, 12), 4);
|
|
}
|
|
}
|
|
addMesh("left_headlight", cuboid(2.36, -0.48, 0.9, 0.08, 0.32, 0.16), 5);
|
|
addMesh("right_headlight", cuboid(2.36, 0.48, 0.9, 0.08, 0.32, 0.16), 5);
|
|
addMesh("left_tail", cuboid(-2.36, -0.55, 0.9, 0.08, 0.28, 0.16), 6);
|
|
addMesh("right_tail", cuboid(-2.36, 0.55, 0.9, 0.08, 0.28, 0.16), 6);
|
|
|
|
const buffer = Buffer.from(bufferParts);
|
|
return {
|
|
asset: { version: "2.0", generator: "osm-asset-pipeline vehicle preview" },
|
|
scene: 0,
|
|
scenes: [{ nodes: nodes.map((_, index) => index) }],
|
|
nodes,
|
|
meshes,
|
|
buffers: [{
|
|
byteLength: buffer.length,
|
|
uri: `data:application/octet-stream;base64,${buffer.toString("base64")}`,
|
|
}],
|
|
bufferViews,
|
|
accessors,
|
|
materials: [
|
|
material("paint red", [0.82, 0.05, 0.035, 1], 0.55, 0.25),
|
|
material("dark roof", [0.08, 0.08, 0.085, 1], 0.45, 0.35),
|
|
material("glass", [0.04, 0.12, 0.16, 0.82], 0.18, 0.08),
|
|
material("tire", [0.015, 0.014, 0.013, 1], 0.75, 0.65),
|
|
material("wheel hub", [0.72, 0.72, 0.68, 1], 0.35, 0.85),
|
|
material("headlight", [1.0, 0.92, 0.62, 1], 0.12, 0.0),
|
|
material("tail light", [0.95, 0.03, 0.03, 1], 0.25, 0.0),
|
|
],
|
|
};
|
|
}
|
|
|
|
function material(name, color, roughness, metallic) {
|
|
return {
|
|
name,
|
|
pbrMetallicRoughness: {
|
|
baseColorFactor: color,
|
|
roughnessFactor: roughness,
|
|
metallicFactor: metallic,
|
|
},
|
|
};
|
|
}
|
|
|
|
function cuboid(cx, lateral, up, sx, width, height) {
|
|
const x0 = cx - sx / 2;
|
|
const x1 = cx + sx / 2;
|
|
const y0 = up - height / 2;
|
|
const y1 = up + height / 2;
|
|
const z0 = lateral - width / 2;
|
|
const z1 = lateral + width / 2;
|
|
const positions = [
|
|
x0, y0, z0, x1, y0, z0, x1, y1, z0, x0, y1, z0,
|
|
x0, y0, z1, x1, y0, z1, x1, y1, z1, x0, y1, z1,
|
|
];
|
|
const indices = [
|
|
0, 1, 2, 0, 2, 3, 4, 6, 5, 4, 7, 6,
|
|
0, 4, 5, 0, 5, 1, 1, 5, 6, 1, 6, 2,
|
|
2, 6, 7, 2, 7, 3, 3, 7, 4, 3, 4, 0,
|
|
];
|
|
return { positions, indices, min: [x0, y0, z0], max: [x1, y1, z1] };
|
|
}
|
|
|
|
function cylinderY(cx, lateral, up, radius, width, segments) {
|
|
const positions = [];
|
|
const indices = [];
|
|
const z0 = lateral - width / 2;
|
|
const z1 = lateral + width / 2;
|
|
for (const z of [z0, z1]) {
|
|
positions.push(cx, up, z);
|
|
for (let i = 0; i < segments; i += 1) {
|
|
const angle = 2 * Math.PI * i / segments;
|
|
positions.push(cx + Math.cos(angle) * radius, up + Math.sin(angle) * radius, z);
|
|
}
|
|
}
|
|
const center0 = 0;
|
|
const center1 = segments + 1;
|
|
for (let i = 0; i < segments; i += 1) {
|
|
const a0 = center0 + 1 + i;
|
|
const b0 = center0 + 1 + ((i + 1) % segments);
|
|
const a1 = center1 + 1 + i;
|
|
const b1 = center1 + 1 + ((i + 1) % segments);
|
|
indices.push(center0, b0, a0);
|
|
indices.push(center1, a1, b1);
|
|
indices.push(a0, b0, b1, a0, b1, a1);
|
|
}
|
|
return {
|
|
positions,
|
|
indices,
|
|
min: [cx - radius, up - radius, z0],
|
|
max: [cx + radius, up + radius, z1],
|
|
};
|
|
}
|
|
|
|
function cesiumPreviewHtml(glbName, metadataName, routeName, vehicleModelName, areaId) {
|
|
return `<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>${escapeHtml(areaId)} Cesium Preview</title>
|
|
<script src="https://cdn.jsdelivr.net/npm/cesium@1.121.1/Build/Cesium/Cesium.js"></script>
|
|
<link href="https://cdn.jsdelivr.net/npm/cesium@1.121.1/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
|
|
<style>
|
|
html, body, #cesiumContainer {
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0;
|
|
overflow: hidden;
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
|
}
|
|
#status {
|
|
position: absolute;
|
|
left: 12px;
|
|
bottom: 12px;
|
|
z-index: 1;
|
|
max-width: 520px;
|
|
padding: 8px 10px;
|
|
border-radius: 4px;
|
|
background: rgba(20, 24, 28, 0.78);
|
|
color: #fff;
|
|
font-size: 12px;
|
|
line-height: 1.45;
|
|
}
|
|
#controls {
|
|
position: absolute;
|
|
top: 12px;
|
|
left: 12px;
|
|
z-index: 1;
|
|
display: flex;
|
|
gap: 8px;
|
|
align-items: center;
|
|
padding: 8px;
|
|
border-radius: 4px;
|
|
background: rgba(20, 24, 28, 0.78);
|
|
color: #fff;
|
|
font-size: 12px;
|
|
}
|
|
#controls button {
|
|
height: 28px;
|
|
border: 0;
|
|
border-radius: 4px;
|
|
padding: 0 10px;
|
|
background: #f2f5f7;
|
|
color: #111;
|
|
cursor: pointer;
|
|
}
|
|
#controls input {
|
|
width: 120px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="cesiumContainer"></div>
|
|
<div id="controls">
|
|
<button id="toggleCruise">Pause</button>
|
|
<button id="toggleFollow">Follow</button>
|
|
<label>Speed <input id="speedControl" type="range" min="2" max="22" step="1" value="8"></label>
|
|
<span id="speedLabel">8 m/s</span>
|
|
</div>
|
|
<div id="status">Loading ${escapeHtml(glbName)}...</div>
|
|
<script>
|
|
const statusEl = document.getElementById("status");
|
|
const toggleCruise = document.getElementById("toggleCruise");
|
|
const toggleFollow = document.getElementById("toggleFollow");
|
|
const speedControl = document.getElementById("speedControl");
|
|
const speedLabel = document.getElementById("speedLabel");
|
|
Cesium.Ion.defaultAccessToken = "";
|
|
|
|
async function main() {
|
|
const metadata = await fetch("${escapeJs(metadataName)}").then((r) => r.json());
|
|
const routeData = await fetch("${escapeJs(routeName)}").then((r) => r.json());
|
|
const anchor = metadata.anchor || {};
|
|
const longitude = Number(anchor.longitude || 0);
|
|
const latitude = Number(anchor.latitude || 0);
|
|
const height = Number(anchor.height || 0);
|
|
const heading = Number(metadata.heading_correction_degrees || 0);
|
|
|
|
const viewer = new Cesium.Viewer("cesiumContainer", {
|
|
animation: false,
|
|
timeline: false,
|
|
baseLayerPicker: false,
|
|
geocoder: false,
|
|
navigationHelpButton: false,
|
|
sceneModePicker: false,
|
|
homeButton: true,
|
|
fullscreenButton: true,
|
|
infoBox: false,
|
|
selectionIndicator: false,
|
|
baseLayer: false
|
|
});
|
|
viewer.scene.globe.depthTestAgainstTerrain = true;
|
|
|
|
const p = Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
|
|
const enu = Cesium.Transforms.eastNorthUpToFixedFrame(p);
|
|
const correction = Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(heading));
|
|
const modelMatrix = Cesium.Matrix4.multiplyByMatrix3(enu, correction, new Cesium.Matrix4());
|
|
const model = await Cesium.Model.fromGltfAsync({
|
|
url: "${escapeJs(glbName)}",
|
|
modelMatrix,
|
|
scale: 1.0
|
|
});
|
|
viewer.scene.primitives.add(model);
|
|
const cruise = addVehicleCruise(viewer, routeData);
|
|
|
|
const center = Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
|
|
viewer.camera.flyToBoundingSphere(
|
|
new Cesium.BoundingSphere(center, 900.0),
|
|
{ duration: 0.0 }
|
|
);
|
|
statusEl.textContent = "${escapeJs(glbName)} | route " + cruise.segment.id + " | " + Math.round(cruise.segment.lengthMeters) + "m";
|
|
}
|
|
|
|
function addVehicleCruise(viewer, routeData) {
|
|
const segment = (routeData.segments || [])[0];
|
|
if (!segment || !segment.coordinates || segment.coordinates.length < 2) {
|
|
throw new Error("No drivable route found in ${escapeJs(routeName)}");
|
|
}
|
|
const speed = Number(routeData.speedMetersPerSecond || 8);
|
|
const start = Cesium.JulianDate.now();
|
|
const duration = Math.max(8, segment.lengthMeters / speed);
|
|
const stop = Cesium.JulianDate.addSeconds(start, duration, new Cesium.JulianDate());
|
|
const positions = new Cesium.SampledPositionProperty();
|
|
let elapsed = 0;
|
|
let previous = segment.coordinates[0];
|
|
positions.addSample(start, Cesium.Cartesian3.fromDegrees(previous[0], previous[1], 1.15));
|
|
for (let i = 1; i < segment.coordinates.length; i += 1) {
|
|
const coord = segment.coordinates[i];
|
|
elapsed += distanceMeters(previous, coord) / speed;
|
|
const time = Cesium.JulianDate.addSeconds(start, elapsed, new Cesium.JulianDate());
|
|
positions.addSample(time, Cesium.Cartesian3.fromDegrees(coord[0], coord[1], 1.15));
|
|
previous = coord;
|
|
}
|
|
positions.setInterpolationOptions({
|
|
interpolationDegree: 1,
|
|
interpolationAlgorithm: Cesium.LinearApproximation
|
|
});
|
|
|
|
viewer.clock.startTime = start.clone();
|
|
viewer.clock.stopTime = stop.clone();
|
|
viewer.clock.currentTime = start.clone();
|
|
viewer.clock.clockRange = Cesium.ClockRange.LOOP_STOP;
|
|
viewer.clock.multiplier = 1;
|
|
viewer.clock.shouldAnimate = true;
|
|
|
|
const flat = [];
|
|
for (const coord of segment.coordinates) {
|
|
flat.push(coord[0], coord[1], 1.05);
|
|
}
|
|
viewer.entities.add({
|
|
name: "Cruise route",
|
|
polyline: {
|
|
positions: Cesium.Cartesian3.fromDegreesArrayHeights(flat),
|
|
width: 4,
|
|
material: Cesium.Color.CYAN.withAlpha(0.85),
|
|
clampToGround: false
|
|
}
|
|
});
|
|
const vehicleOrientation = correctedVehicleOrientation(positions, -90.0);
|
|
const vehicle = viewer.entities.add({
|
|
name: "Cruise vehicle",
|
|
availability: new Cesium.TimeIntervalCollection([
|
|
new Cesium.TimeInterval({ start, stop })
|
|
]),
|
|
position: positions,
|
|
orientation: vehicleOrientation,
|
|
model: {
|
|
uri: "${escapeJs(vehicleModelName)}",
|
|
scale: 1.0,
|
|
minimumPixelSize: 24,
|
|
maximumScale: 80
|
|
},
|
|
path: {
|
|
resolution: 1,
|
|
leadTime: 4,
|
|
trailTime: 10,
|
|
width: 2,
|
|
material: Cesium.Color.ORANGE.withAlpha(0.9)
|
|
}
|
|
});
|
|
toggleCruise.addEventListener("click", () => {
|
|
viewer.clock.shouldAnimate = !viewer.clock.shouldAnimate;
|
|
toggleCruise.textContent = viewer.clock.shouldAnimate ? "Pause" : "Play";
|
|
});
|
|
speedControl.addEventListener("input", () => {
|
|
const value = Number(speedControl.value);
|
|
viewer.clock.multiplier = value / speed;
|
|
speedLabel.textContent = value + " m/s";
|
|
});
|
|
const follow = createChaseFollow(viewer, positions);
|
|
toggleFollow.addEventListener("click", () => {
|
|
if (follow.enabled) {
|
|
follow.stop();
|
|
toggleFollow.textContent = "Follow";
|
|
} else {
|
|
follow.start();
|
|
toggleFollow.textContent = "Free";
|
|
}
|
|
});
|
|
return { segment, vehicle };
|
|
}
|
|
|
|
function correctedVehicleOrientation(positions, yawDegrees) {
|
|
const velocityOrientation = new Cesium.VelocityOrientationProperty(positions);
|
|
const correction = Cesium.Quaternion.fromAxisAngle(
|
|
Cesium.Cartesian3.UNIT_Z,
|
|
Cesium.Math.toRadians(yawDegrees)
|
|
);
|
|
return new Cesium.CallbackProperty((time, result) => {
|
|
const base = velocityOrientation.getValue(time);
|
|
if (!base) return result;
|
|
return Cesium.Quaternion.multiply(base, correction, result || new Cesium.Quaternion());
|
|
}, false);
|
|
}
|
|
|
|
function createChaseFollow(viewer, positions) {
|
|
const scratchPosition = new Cesium.Cartesian3();
|
|
const scratchPrevious = new Cesium.Cartesian3();
|
|
const scratchDirection = new Cesium.Cartesian3();
|
|
const scratchEast = new Cesium.Cartesian3();
|
|
const scratchNorth = new Cesium.Cartesian3();
|
|
const scratchUp = new Cesium.Cartesian3();
|
|
const offset = new Cesium.Cartesian3();
|
|
const state = { enabled: false, distance: 36.0, height: 18.0 };
|
|
|
|
function update(clock) {
|
|
const time = clock.currentTime;
|
|
const position = positions.getValue(time, scratchPosition);
|
|
if (!position) return;
|
|
const previousTime = Cesium.JulianDate.addSeconds(time, -0.8, new Cesium.JulianDate());
|
|
const previous = positions.getValue(previousTime, scratchPrevious);
|
|
if (previous) {
|
|
Cesium.Cartesian3.subtract(position, previous, scratchDirection);
|
|
} else {
|
|
Cesium.Cartesian3.clone(Cesium.Cartesian3.UNIT_X, scratchDirection);
|
|
}
|
|
if (Cesium.Cartesian3.magnitudeSquared(scratchDirection) < 0.0001) {
|
|
Cesium.Cartesian3.clone(Cesium.Cartesian3.UNIT_X, scratchDirection);
|
|
}
|
|
Cesium.Cartesian3.normalize(scratchDirection, scratchDirection);
|
|
Cesium.Cartesian3.normalize(position, scratchUp);
|
|
Cesium.Cartesian3.cross(Cesium.Cartesian3.UNIT_Z, scratchUp, scratchEast);
|
|
if (Cesium.Cartesian3.magnitudeSquared(scratchEast) < 0.0001) {
|
|
Cesium.Cartesian3.clone(Cesium.Cartesian3.UNIT_X, scratchEast);
|
|
} else {
|
|
Cesium.Cartesian3.normalize(scratchEast, scratchEast);
|
|
}
|
|
Cesium.Cartesian3.cross(scratchUp, scratchEast, scratchNorth);
|
|
Cesium.Cartesian3.normalize(scratchNorth, scratchNorth);
|
|
|
|
const eastComponent = Cesium.Cartesian3.dot(scratchDirection, scratchEast);
|
|
const northComponent = Cesium.Cartesian3.dot(scratchDirection, scratchNorth);
|
|
const heading = Math.atan2(eastComponent, northComponent);
|
|
Cesium.Cartesian3.fromElements(0.0, -state.distance, state.height, offset);
|
|
const transform = Cesium.Transforms.headingPitchRollToFixedFrame(
|
|
position,
|
|
new Cesium.HeadingPitchRoll(heading, 0.0, 0.0)
|
|
);
|
|
viewer.camera.lookAtTransform(transform, offset);
|
|
}
|
|
|
|
function onWheel(event) {
|
|
if (!state.enabled) return;
|
|
event.preventDefault();
|
|
const zoom = event.deltaY > 0 ? 1.12 : 0.88;
|
|
state.distance = Cesium.Math.clamp(state.distance * zoom, 12.0, 160.0);
|
|
state.height = Cesium.Math.clamp(state.height * zoom, 6.0, 90.0);
|
|
update(viewer.clock);
|
|
}
|
|
|
|
return {
|
|
get enabled() {
|
|
return state.enabled;
|
|
},
|
|
start() {
|
|
if (state.enabled) return;
|
|
state.enabled = true;
|
|
viewer.trackedEntity = undefined;
|
|
viewer.canvas.addEventListener("wheel", onWheel, { passive: false });
|
|
viewer.clock.onTick.addEventListener(update);
|
|
update(viewer.clock);
|
|
},
|
|
stop() {
|
|
if (!state.enabled) return;
|
|
state.enabled = false;
|
|
viewer.clock.onTick.removeEventListener(update);
|
|
viewer.canvas.removeEventListener("wheel", onWheel);
|
|
viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
|
|
}
|
|
};
|
|
}
|
|
|
|
function distanceMeters(a, b) {
|
|
const radius = 6371008.8;
|
|
const lat1 = Cesium.Math.toRadians(a[1]);
|
|
const lat2 = Cesium.Math.toRadians(b[1]);
|
|
const dLat = Cesium.Math.toRadians(b[1] - a[1]);
|
|
const dLon = Cesium.Math.toRadians(b[0] - a[0]);
|
|
const sinLat = Math.sin(dLat / 2);
|
|
const sinLon = Math.sin(dLon / 2);
|
|
const h = sinLat * sinLat + Math.cos(lat1) * Math.cos(lat2) * sinLon * sinLon;
|
|
return 2 * radius * Math.asin(Math.min(1, Math.sqrt(h)));
|
|
}
|
|
|
|
main().catch((error) => {
|
|
console.error(error);
|
|
statusEl.textContent = "Failed to load Cesium preview: " + error.message;
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|
|
`;
|
|
}
|
|
|
|
function escapeHtml(value) {
|
|
return String(value)
|
|
.replaceAll("&", "&")
|
|
.replaceAll("<", "<")
|
|
.replaceAll(">", ">")
|
|
.replaceAll('"', """);
|
|
}
|
|
|
|
function escapeJs(value) {
|
|
return String(value).replaceAll("\\", "\\\\").replaceAll('"', '\\"');
|
|
}
|