最新 vie-vite框架下 jtopo安装使用
官方地址
官方源码
安装下载
1.官方好像都没有给git地址,尝试npm安装报错

2.找到1.0.5之前的版本npm i jtopo2,安装成功后使用报错,应该是版本冲突了

1.本地引入,
点击官方源码下载,需要jtopo_npm文件

2.引入到本地根目录

3.vue文件使用
<template><!-- 用于渲染显示的div --><div id="divId" style="height:600px;width:680px;border:1px solid gray"></div>
</template><script setup lang="ts">
import { onMounted } from 'vue'
import { topoManager } from "./TopoManager";
/** 初始化 */
onMounted(() => {topoManager.init(document.getElementById("divId"));
})
</script>
4.TopoManager文件是官方文件
import {Stage, Layer, Node, Link} from ‘…/…/jtopo_npm/core’;
能正常build打包,不确定生产环境地址是否有问题,若有使用后续更新
下面有安装到node_modules的方法,不用修改地址

运行成功

以前使用jtopo-in-node,但版本很旧了,文档都找不到了
import ‘jtopo-in-node’;
是这种使用方式 new JTopo.Scene(stage);
按官网提示 cnpm install ./jtopo_npm/core
一直安装失败,不知道是不是版本的问题
看到官方package.json

灵机一动,给本地项目加上
"@jtopo/core": "file:jtopo_npm/core","@jtopo/editor": "file:jtopo_npm/editor",
再执行cnpm i ,node_modules依赖包上有了
直接import {Stage, Layer, Node, Link} from '@jtopo/core';引入,也能运行成功了



尝试使用,也是2d画图的
Konva
相关文章:
最新 vie-vite框架下 jtopo安装使用
官方地址 官方源码 安装下载 1.官方好像都没有给git地址,尝试npm安装报错 2.找到1.0.5之前的版本npm i jtopo2,安装成功后使用报错,应该是版本冲突了 1.本地引入, 点击官方源码下载,需要jtopo_npm文件 2.引入到本…...
基础课20——智能客服系统的使用维护
1.智能客服系统的维护 智能客服系统在上线后,仍然需要定期的维护和更新。这是因为智能客服系统是一个复杂的软件系统,涉及到多个组件和功能,需要不断优化和改进以满足用户需求和保持市场竞争力。 保持系统的稳定性和性能:随着用…...
Aop自定义注解生成日志
Aop自定义注解生成日志 1.编写自定义注解 //表示此注解可以标注在方法上 Target(ElementType.METHOD) //运行时生效 Retention(RetentionPolicy.RUNTIME) public interface OpetionLog {//定义一个变量,可以接收参数String value() default "";}2.Cont…...
虚幻引擎:RPC:远端调用
1.如何区当前是服务器还是在客服端 2.如何修改一个actor的所有权 修改所有权必须 在服务器上进行修改,不允许在客户端进行修改...
涉及多种位运算操作混合类题目——通过加转三进制(扩大状态,不变枚举量):CF1033F
https://www.luogu.com.cn/problem/CF1033F 我们发现直接用二进制来做很难做,但我们可以观察其给的表 我们发现如果表示成和的形式是容易进行一一对应的 对于询问的时候,我们直接枚举每位有的和是多少,虽然状态是三次的,但是对于…...
BIOS开发笔记 - DDR基础
简介 内存是计算机中重要的组成部分,主要为CPU计算时提供一个数据的临时存储的场所。CPU在处理数据前,会将数据从外存复制到内存中,然后再处理内存中的数据,如果需要将结果保存,则一次性写回外存,这样便大大提高CPU的处理效率。 …...
基于SpringBoot+Vue的旅游系统、前后端分离
博主24h在线,想要源码文档部署视频直接私聊,低价有偿! 基于SpringBootVue的旅游系统、前后端分离 开发语言:Java 数据库:MySQL 技术:SpringBoot、Vue、Mybaits Plus、ELementUI 工具:IDEA/Eci…...
手动制作Docker容器镜像
文章目录 手动制作Docker容器镜像说明前期准备制作镜像1.启动一个centos系统的容器2.在centos容器中源码安装httpd服务3.基于已经安装好httpd服务的centos容器制作一个httpd镜像4.验证制作出来的镜像的功能5.上传至自己的docker镜像仓库(可选) 手动制作D…...
WPF布局控件之WrapPanel布局
前言:博主文章仅用于学习、研究和交流目的,不足和错误之处在所难免,希望大家能够批评指出,博主核实后马上更改。 概述: 后续排序按照从上至下或从右至左的顺序进行,具体取决于方向属性的值。WrapPanel 位…...
实现自动接听电话
在Android 12中实现自动接听电话的功能可以通过使用特定的API来实现,具体的实现方法如下: 导入需要的类库和接口 import android.content.BroadcastReceiver; import android.content.Context; import android.content.Intent; import android.os.Bundle; import android.te…...
计算机网络之网络层(全)
网络层的功能 互联网在网络层的设计思路是,向上只提供简单灵活的、无连接的、尽最大努力交付的数据报服务。 路由器在能够开始向输出链路传输分组的第一位之前,必须先接收到整个分组,这种机制称为:存储转发机制 异构网络互连 用…...
PS学习笔记合集
2.一些快捷键 一、放大快捷键 Ctrl:在画布中点击一次,即可放大一次,可多次点击。 CtrlShift:在画布中点击一次,即可放大到适合窗口大小。 CtrlAlt:在画布中点击一次,即可放大到适合窗口大小&a…...
汇总记录Python常用的基础内置方法
这里汇总记录一些Python常用的基础内置方法 (参照哔站有一个大佬"小飞有点东西"的笔记整理记录而得,仅限方便需要的时候可以直接在网上搜索查阅而整理记录) 输出/输入 print() input()print打印颜色设置 显示方式;前景颜色;背景颜色,这3个…...
基于Tensorflow卷积神经网络玉米病害识别系统(UI界面)
欢迎大家点赞、收藏、关注、评论啦 ,由于篇幅有限,只展示了部分核心代码。 文章目录 一项目简介 二、功能三、系统四. 总结 一项目简介 Tensorflow是一个流行的机器学习框架,可用于训练和部署各种人工智能模型。玉米病害识别系统基于Tensorf…...
Execution failed for task ‘:keyboard_utils:compileDebugKotlin‘.
Execution failed for task ‘:keyboard_utils:compileDebugKotlin’. 这个错误是keyboard_utils依赖报错。 这个问题在keyboard_utils github项目的issues 有记载Project does not run with new Flutter 2.10.0 详细错误信息: e: /Users/andreifufylev/developme…...
AC修炼计划(AtCoder Regular Contest 163)
传送门:AtCoder Regular Contest 163 - AtCoder 第一题我们只需要将字符串分成两段,如果存在前面一段比后面一段大就成立。 #include<bits/stdc.h> #define int long long using namespace std; typedef long long ll; typedef pair<int,int&g…...
持续进化,快速转录,Faster-Whisper对视频进行双语字幕转录实践(Python3.10)
Faster-Whisper是Whisper开源后的第三方进化版本,它对原始的 Whisper 模型结构进行了改进和优化。这包括减少模型的层数、减少参数量、简化模型结构等,从而减少了计算量和内存消耗,提高了推理速度,与此同时,Faster-Whi…...
【设计模式】第24节:行为型模式之“模板方法模式”
一、简介 模板方法模式在一个方法中定义一个算法骨架,并将某些步骤推迟到子类中实现。模板方法模式可以让子类在不改变算法整体结构的情况下,重新定义算法中的某些步骤。 模板模式有两大作用:复用和扩展。其中,复用指的是&#…...
【考研数学】数学“背诵手册”(二)| 线代及概率论部分
文章目录 引言二、线代施密特正交化分块矩阵转置、逆、伴随之间的运算关于秩定义性质 三、概统常见分布的期望及方差 引言 这数一全部内容太多了,放在一篇文章里的话,要编辑就很困难,就把线代和概率放在这篇文章里吧。 二、线代 施密特正交…...
Android WMS——WindowState介绍(十三)
前面文章中的 addWindow 方法,首先获取了 DisplayContent,紧接着判断窗口的 type 类型并标记。然后获取 token 信息,且该信息是通过 DisplayContent 中的方法获取的。最后就是创建并保存 WindowState 信息。 一、简介 在窗口管理系统(Window Manager Service,WMS)中,Wi…...
Neo.mjs性能优化:如何实现每秒40,000+增量更新的秘密
Neo.mjs性能优化:如何实现每秒40,000增量更新的秘密 【免费下载链接】neo The application worker driven frontend framework 项目地址: https://gitcode.com/gh_mirrors/neo/neo Neo.mjs作为一款由应用工作器驱动的前端框架,以其卓越的性能表现…...
利用快马平台与vscode codex快速构建react待办事项应用原型
最近在尝试用AI工具快速验证产品原型,发现InsCode(快马)平台配合VSCode Codex能实现惊人的开发效率。以React待办事项应用为例,从零到可交互原型只用了不到10分钟,分享下具体实现思路和操作过程。 需求拆解与AI描述 首先将待办事项应用的7个核…...
不止于超市:用QGIS缓冲区+叠置分析,为你的奶茶店、自习室找个好位置
从奶茶店到自习室:QGIS空间分析赋能小微商业选址决策 走在街头,你是否好奇为什么某些奶茶店总是门庭若市,而几步之隔的同类店铺却冷冷清清?商业选址从来不是简单的"地段好"三个字能概括的。对于资金有限的小微创业者来说…...
构建智能体的专业技能树 - Agent Skills生态全析(中篇)
一、概述 这篇文章我们将围绕Skills、Tools、MCP、Subagents 四个组件有什么区别、Anthropic 官方做好了哪些现成 Skills、如何从零创建一个自定义 Skill 的完整流程 这些四个方面来进行讲解。 二、智能体生态系统概览 在 Anthropic 构建的智能体生态中,多种技术组件…...
Kandinsky-5.0-I2V-Lite-5s实战案例:用会议合影生成带入场动画的团队介绍视频
Kandinsky-5.0-I2V-Lite-5s实战案例:用会议合影生成带入场动画的团队介绍视频 1. 项目背景与价值 想象一下这个场景:公司刚开完年度战略会议,团队拍了一张大合影。现在需要制作一个团队介绍视频,传统方式需要找专业剪辑师&#…...
Leather Dress Collection 角色扮演效果:模拟不同风格的IT技术面试官
Leather Dress Collection 角色扮演效果:模拟不同风格的IT技术面试官 最近在玩一个挺有意思的AI工具,叫Leather Dress Collection。名字听起来有点怪,但它有个功能让我眼前一亮:角色扮演。你可以让它扮演各种角色,并且…...
别再到处找了!这12个三维点云开源数据集,够你从入门到项目实战
三维点云实战指南:12个精选开源数据集与精准匹配策略 当你第一次打开三维点云处理软件,面对空白的项目界面,最迫切的问题往往是:"我该从哪里获取高质量的训练数据?"这个问题困扰过每一位初学者,…...
AI图像抠图新体验:cv_unet_image-matting参数调优全解析
AI图像抠图新体验:cv_unet_image-matting参数调优全解析 1. 引言:为什么需要专业抠图工具 在日常工作和生活中,我们经常需要处理图片——制作证件照、设计海报、编辑产品图等等。传统的手动抠图不仅耗时耗力,而且对技术要求高&a…...
高压柔性输电系统中的6脉冲与12脉冲晶闸管控制HVDC仿真模型说明文档
高压柔性输电系统6脉冲,12脉冲晶闸管控制HVDC的仿真模型,说明文档江湖上流传着这么一句话:"搞HVDC不玩晶闸管,就像吃火锅不放辣"。今天咱们就扒一扒那些藏在MATLAB/Simulink里的6脉冲和12脉冲换流器秘密。先说个冷知识&…...
P3C黄山版突破式迁移指南:无缝升级Java代码规范检查体系
P3C黄山版突破式迁移指南:无缝升级Java代码规范检查体系 【免费下载链接】p3c Alibaba Java Coding Guidelines pmd implements and IDE plugin 项目地址: https://gitcode.com/gh_mirrors/p3/p3c 在Java开发团队中,代码规范检查工具的升级往往伴…...
