zoukankan      html  css  js  c++  java
  • Cesium中的样条插值

    Cesium中的样条插值


    在cesium里,提供了三种样条插值方法,LinearSpline,CatmullRomSpline,HermiteSpline。
    在具体的实例上,可以使用样条插值法利用已知的控制点,插值出一系列的点,用于平滑曲线,特别是在路径的追朔重演。
    下面,我们分别介绍这三种样条插值的使用方法以及效果。

    LinearSpline(线性样条)

    线性样条从效果上看,是把所有控制点一一连线,并在连线上做定点取值

    1、设置几个控制点,并添加到场景中,聚焦视角

    • var controls = [
    • Cesium.Cartesian3.fromDegrees(110, 10),
    • Cesium.Cartesian3.fromDegrees(111, 11),
    • Cesium.Cartesian3.fromDegrees(112, 9),
    • Cesium.Cartesian3.fromDegrees(114, 10),
    • Cesium.Cartesian3.fromDegrees(113, 8)
    • ];
    • for (var i = 0; i < controls.length; i++) {
    • viewer.entities.add({
    • position: controls[i],
    • point: {
    • color: Cesium.Color.RED,
    • pixelSize: 10
    • }
    • });
    • }
    • viewer.zoomTo(viewer.entities);

    2、创建LinearSpline对象

    • var spline = new Cesium.LinearSpline({
    • times: [0.0, 0.25, 0.5, 0.75, 1],
    • points: controls
    • });

    3、插值100个点

    • var positions = [];
    • for (var i = 0; i <= 100; i++) {
    • var cartesian3 = spline.evaluate(i / 100);
    • positions.push(cartesian3);
    • viewer.entities.add({
    • position: cartesian3,
    • point: {
    • color: Cesium.Color.YELLOW,
    • pixelSize: 6
    • }
    • });
    • }

    4、将插值所有的点绘制成线

  • 相关阅读:
    function函数
    for的衍生对象
    前端发展史
    字符串替换
    正则
    DOM和BOM的区别与联系
    BOM
    DOM
    css单位分析
    API and Web API
  • 原文地址:https://www.cnblogs.com/yaohuimo/p/11692239.html
Copyright © 2011-2022 走看看