Cargo-Planner Docs

在您的应用程序中使用Cargo-Planner

虽然我们的网络应用程序应该可以覆盖大多数使用场景,但有时可能需要将装载规划功能添加到现有的WMS或ERP系统中,或者您自己的定制网络门户中。您可以通过使用我们的Rest API和JavaScript SDK来利用大部分功能。

服务器端

虽然实际上您不需要使用服务器,但它是作为Cargo-Planner和客户端之间的中介的一个好方法。 如果您有办法安全地将API令牌发布到客户端(请记住,将密钥存储在localStorage或代码中不是好的做法) - 您可以直接从客户端调用我们的API。

# /calculate endpoint at your server located at https://api.acme.com

import requests
import json

CARGO_PLANNER_TOKEN = 'Token your-token'

def calculate(request):
    response = requests.post(
        url="https://api.cargo-planner.com/api/2/calculate/",
        data=json.dumps(request.data),
        headers={
            'Content-type': 'application/json',
            'Authorization': CARGO_PLANNER_TOKEN
        })
    if response.status_code == 200:
        return response.json()
    #...

客户端

这里获取我们的SDK。下面的示例将调用上述端点,该端点将调用我们的API并返回您的计算数据的装载计划/解决方案,然后显示每个集装箱的3D图像。

<meta charset="utf-8">
<title>我的客户门户</title>
<script src="./cargoPlannerSDK.umd.min.js"></script>

<body>
    <h1>装载计划</h1>
</body>

<script>

calculate();

async function calculate() {

    // 初始化3D引擎
    await cargoPlannerSDK.SceneManager.init();

    // 请参阅API文档以获取更多选项
    let calculationData = {
        length_dim: "M",
        weight_dim: "KG",
        "items": [
            {
                "label": "货物 1",
                "l": 1.2,
                "w": 0.8,
                "h": 0.5,
                "wt": 300,
                "qty": 20,
                "layers": 2,
                "color":"#48c9b0"
            },
            {
                "label": "货物 2",
                "l": 1.2,
                "w": 1.0,
                "h": 0.9,
                "wt": 300,
                "qty": 20,
                "layers": 2,
                "color":"#ec7063"
            },

        ],
        "settings": {
          "group_items": true
        },
        "container_types": [
            {
                "name": "40ft DV",
                "L":    12,
                "W":    2.33,
                "H":    2.38,
                "payload": 22000,
                "door": {
                  H: 2.33,
                  W: 2.28
                }
            }
        ]
    }

    fetch('/calculate/', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify(calculationData),
    })
    .then(response => response.json())
    .then(data => {
        // 如果我们收到任何解决方案
        if(data.solutions) {

            // 目前每次计算给出一个解决方案(将来我们可能会提供更多)
            data.solutions.forEach((solution) => {

                // 遍历每个集装箱
                solution.containers.forEach((container, index) => {

                    // 渲染画布
                    cargoPlannerSDK.SceneManager.createScene(
                        container,  // 集装箱数据
                        null,       // 交互模式(显示多个集装箱时设置为null)
                        400,        // 像素宽度
                        200         // 像素高度
                    ).then((canvas) => {

                        const containerDiv = document.createElement("div");

                        const label = document.createTextNode(`集装箱 ${index+1}: ${container.name}`)
                        containerDiv.appendChild(label);
                        containerDiv.appendChild(canvas);

                        document.body.appendChild(containerDiv);
                    });

                });
            });
        }
    });
}

</script>

上述示例将生成以下装载计划:

从API生成的装载计划