数化软件文档 数化软件文档
  • OpenZIAPI

    • OpenZIAPI产品说明
    • 工程初始化构建
    • 本地启动
    • 云渲染启动及守护进程
    • 工程打包操作手册
    • 项目配置介绍
    • 虚幻开发环境
    • TS开发环境
    • 集成到现有项目
    • 开启或关闭Tips弹窗
    • API值域范围修改
    • API天气系统美术调试
    • API天气系统模板制作参考
    • 蓝图调用API接口使用
    • 配置关卡及网页加载
    • 网页调用API接口使用
  • OpenZIEditor

    • OpenZIEditor产品说明
    • 工程初始化构建
    • 本地启动
    • 云渲染启动及守护进程
    • 工程打包操作手册
    • 项目配置介绍
    • 虚幻开发环境
    • TS开发环境
    • 集成到现有项目
    • 场景(Scene)创建加载保存改名
    • 调用添加API接口
    • 设置Setting界面
    • 数字孪生体
    • 添加使用自定义配置
    • 预制体
    • 资源编辑
    • 自定义资源打包
  • 关卡

    • 关卡管理
    • 坐标系
  • 环境

    • 天气调节
    • 天气系统
  • 交互

    • 控制器管理
    • Axes轴管理
    • CesiumPawn管理
  • 图层

    • Cesium地形服务管理
    • Cesium影像服务管理
    • Cesium_3dTileset服务管理
  • 标绘

    • 标绘
    • 标绘点
    • 标绘线
    • 标绘面
    • 窗口管理
    • 地理围栏
    • 光流线
    • 箭头线
    • 屏幕坐标
    • 三维叠加
    • 预警点位
    • OD线
    • POI打点管理
    • 单个种植
    • 沿线种植
    • 笔刷种植
  • 分析

    • 测量
    • 测量距离
    • 测量面积
    • 测量坐标点
    • 单值柱状图
    • 镜头漫游
    • 可视域分析
    • 热力图
    • 热力线
    • 数值柱状图
    • 天际线
  • 编辑器

    • 自定义场景
    • 网页
    • 预制体
    • 数字孪生体
  • 其他

    • 控制台指令
    • Actor管理
    • API管理
  • 产品开发

    • 产品流程全景图
    • 继承C++类开发API
    • 蓝图增量开发方式
    • 美术场景控制开发
    • 使用蓝图Mixin功能开发API
    • 使用MVVM模式开发新的API
    • APIMVVM
    • C++增量开发
    • IHandle
    • MVVM模式
    • OpenZIAPI
    • TS文件目录介绍
    • VsCode配置PuerTS
    • WEB页面集成方式
    • WebStrom配置PuerTS
商用授权
返回官网 (opens new window)
  • OpenZIAPI

    • OpenZIAPI产品说明
    • 工程初始化构建
    • 本地启动
    • 云渲染启动及守护进程
    • 工程打包操作手册
    • 项目配置介绍
    • 虚幻开发环境
    • TS开发环境
    • 集成到现有项目
    • 开启或关闭Tips弹窗
    • API值域范围修改
    • API天气系统美术调试
    • API天气系统模板制作参考
    • 蓝图调用API接口使用
    • 配置关卡及网页加载
    • 网页调用API接口使用
  • OpenZIEditor

    • OpenZIEditor产品说明
    • 工程初始化构建
    • 本地启动
    • 云渲染启动及守护进程
    • 工程打包操作手册
    • 项目配置介绍
    • 虚幻开发环境
    • TS开发环境
    • 集成到现有项目
    • 场景(Scene)创建加载保存改名
    • 调用添加API接口
    • 设置Setting界面
    • 数字孪生体
    • 添加使用自定义配置
    • 预制体
    • 资源编辑
    • 自定义资源打包
  • 关卡

    • 关卡管理
    • 坐标系
  • 环境

    • 天气调节
    • 天气系统
  • 交互

    • 控制器管理
    • Axes轴管理
    • CesiumPawn管理
  • 图层

    • Cesium地形服务管理
    • Cesium影像服务管理
    • Cesium_3dTileset服务管理
  • 标绘

    • 标绘
    • 标绘点
    • 标绘线
    • 标绘面
    • 窗口管理
    • 地理围栏
    • 光流线
    • 箭头线
    • 屏幕坐标
    • 三维叠加
    • 预警点位
    • OD线
    • POI打点管理
    • 单个种植
    • 沿线种植
    • 笔刷种植
  • 分析

    • 测量
    • 测量距离
    • 测量面积
    • 测量坐标点
    • 单值柱状图
    • 镜头漫游
    • 可视域分析
    • 热力图
    • 热力线
    • 数值柱状图
    • 天际线
  • 编辑器

    • 自定义场景
    • 网页
    • 预制体
    • 数字孪生体
  • 其他

    • 控制台指令
    • Actor管理
    • API管理
  • 产品开发

    • 产品流程全景图
    • 继承C++类开发API
    • 蓝图增量开发方式
    • 美术场景控制开发
    • 使用蓝图Mixin功能开发API
    • 使用MVVM模式开发新的API
    • APIMVVM
    • C++增量开发
    • IHandle
    • MVVM模式
    • OpenZIAPI
    • TS文件目录介绍
    • VsCode配置PuerTS
    • WEB页面集成方式
    • WebStrom配置PuerTS
商用授权
返回官网 (opens new window)
  • 在线文档
  • 开发文档
OpenZIProject
2024-03-14

WEB页面集成方式

一、网页的Html中引用JS脚本

参考:OpenZIAPI产品/Script/Web/scripts/OpenZIAPI.js

二、使用示例如下:

参考:OpenZIAPI产品/Script/Web/scripts/main.js

<script src="./scripts/OpenZIAPI.js"></script>
var OpenZIAPI;
function WebSocketInit() {
        //初始化api
    let socketUrl = "ws://127.0.0.1:18892/";
    OpenZIAPI = new OpenZILab(socketUrl)
    if (OpenZIAPI.APISocket) {
        OpenZIAPI.APISocket.onopen = function (data) {
            // alert("socket连接成功")
            console.log("socket连接成功")
        }
        OpenZIAPI.APISocket.onerror = function (data) {
            alert("socket连接失败")
        }
    } else {
        alert("socket连接失败")
    }
    eventListener();
    }

function eventListener() {
    OpenZIAPI.Call("ALLReceiveMessage", function (event) {
        console.log("监听回调:")
        console.log(event);
        info.prepend(JSON.stringify(event), "\n");
    });
}

function run() {
    let text = document.getElementById("textarea");
    try {
        let data = JSON.parse(text.value);
        if (data) {
            OpenZIAPI.Call(currJson.class, currJson.function, data, (e) => {
                console.log("点位信息回调:", e)
                info.prepend(JSON.stringify(e, null, 2).replace(/\\/g, ""), "\n");
            })
        }
    } catch (r) {
        alert("数据格式异常");
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
Theme by Vdoing | Copyright © 2022-2025 OpenZI数化软件 | 成都曾自科技有限公司 | 蜀ICP备2022026689号-1 | 川公网安备 51015602000460号
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式