姚家湾
姚家湾

VUE3 中导入Visio 图形

        微软的Visio是一个功能强大的图形设计工具，它能够绘制流程图，P&ID，UML 类图等工程设计中常用的图形。它要比其它图形设计软件要简单许多。以后我的博文中将更多地使用VISO 来绘制图形。之前我一直使用的是corelDraw。

        Visio 已经在工程设计中得到广泛的应用。

本博客讨论如何将Visio 设计的SVG 导入webHMI。

目的与方法

        我的目标是使用Visio 绘制石化行业的工艺和仪表流程图（P&ID ），并将它导入VUE3 的前端显示出来。

  •   直接导入Web 不做任何的修改和添加
  •   图形要能够携带一些数据属性
  •   能够与后端的OPC UA 模型相对应
  • 实现图形可点击

之前我曾经使用其它的方式：

  • 使用autoCAD 绘制，输出DXF
  • 使用corelDaw ，Inkscape 等软件绘制，然后人工添加内置的javascript小程序
  • 使用javascript 的widget  canvas 绘制
  • 使用SVG和svidget 插件实现。

         在我过往的博文中可以找到我的实验，这些方法或多或少需要额外的编程，或者格式转换。这次我们尝试直接导入Visio 产生的SVG 图形。

实现 

简单的P&ID 图

使用Visio 就不多说了，我画了一个简单的P&ID图。

VUE3 中导入Visio 图形_第1张图片

Visio 图形添加数据属性

        图形中需要包含一些数据，最常见的需要一个DataTag 能够将图形与后端数据相对应，我这里使用OPCUA 作为后端信息模型，所以，至少我们需要OPCUA 节点的基本信息：

  • NodeId
  • BrowseName
  • DisplayName
  • NodeType

        值得庆幸的是Visio 图形支持添加数据属性，它们成为形状数据，添加的具体方式是右键点击图形，选择”数据“=》”定义形状数据“

VUE3 中导入Visio 图形_第2张图片

你可以点击新建，添加新的属性，在上图中，我们添加了NodeId 。

当从Visio 导出SVG 文件时，形状数据会作为专用属性（v:custProps）

在前端载入时，我们要读取NodeId 的值，将它填写到 的onclick 参数中 （见下面的源代码）

SVG 嵌入到HTML 中

SVG 嵌入到HTML 网页中有许多的方法，之前我使用嵌入在 中。

使用

      作为HMI，SVG 图形中的每一个图形都是可以点击的（Click able），这需要在导入HTML 时添加到 中，但是我发现，在 内部的SVG 添加了onclick 之后，无法方位VUE3 中的OnClick 函数，即便增加了Window.οnclick=this.Click 也不行。内部无法调用外部函数。

使用vite-svg-loader插件

第二种方式是使用vite-svg-loader插件，

结果发现也不行。vite-svg-loader 只是装入了图形，将数据的内容都阉割掉了。

可行的方式-直接导入SVG到HTML

经过不断的尝试，采用了如下可行的方式：

将SVG 直接作为字符串插入到

中去。读取SVG 的方式可以为两种：

  • 通过axios 从后端读取
  • 通过import pid from ”@/assets/pid.svg@raw"
最终的代码

小结

        在自动化系统中，HMI 逐步转向HTML5。但是这是标准化不够的部分，如何将HTML 的UI 与后台的信息模型建立对应关系，是值得探讨的。这里我们尝试了Visio 图形与前端HTML5 UI，后端OPCUA 信息模型建立简单，清晰的对应方式。尽管没有使用DEXPI 标准，但是SVG 似乎更加便捷。 

你可能感兴趣的:(HTML5,OPCUA)

  • html标题行距怎么设,html怎么设置行距 weixin_39762666 html标题行距怎么设
    html中，可以通过style属性，给段落元素添加“line-height:间距值;”样式来设置行距，例“本教程操作环境：windows7系统、CSS3&&HTML5版、DellG3电脑。html设置行距这是一个标准行高的段落。这是一个标准行高的段落。大多数浏览器的默认行高约为110%至120%。这是一个更小行高的段落。这是一个更小行高的段落。这是一个更小行高的段落。这是一个更小行高的段落。这是一
  • 深入探索 HTML5 拖拽效果 API：打造流畅交互体验 山禾女鬼001 html5前端html
    在现代的Web开发中，交互性和用户体验一直是开发者关注的重点。HTML5的拖拽效果API(DragandDropAPI)提供了一种非常直观的方式来让网页元素或文件能够被拖动并放置到页面的指定位置，极大提升了用户的交互体验。本篇文章将深入探讨如何使用HTML5拖拽API来实现拖拽效果，帮助开发者理解并掌握这一强大的工具。一、HTML5拖拽API简介HTML5的拖拽API允许用户通过鼠标或触摸屏等设备
  • HTML5 技术深度解读：本地存储与地理定位的最佳实践 吴师兄大模型 html5前端html本地存储地理定位localStorageGeolocationAPI
    系列文章目录01-从零开始学HTML：构建网页的基本框架与技巧02-HTML常见文本标签解析：从基础到进阶的全面指南03-HTML从入门到精通：链接与图像标签全解析04-HTML列表标签全解析：无序与有序列表的深度应用05-HTML表格标签全面解析：从基础到高级优化技巧06-HTML表单深度解析：GET和POST提交方法07-HTML表单控件类型大全：文本框、密码框、文件上传全掌握08-前端表单验
  • HTML5 Canvas 与 SVG：让网页图形与动画活跃起来 吴师兄大模型 html5前端htmlCanvasSVG网页图形与动画HTML5
    系列文章目录01-从零开始学HTML：构建网页的基本框架与技巧02-HTML常见文本标签解析：从基础到进阶的全面指南03-HTML从入门到精通：链接与图像标签全解析04-HTML列表标签全解析：无序与有序列表的深度应用05-HTML表格标签全面解析：从基础到高级优化技巧06-HTML表单深度解析：GET和POST提交方法07-HTML表单控件类型大全：文本框、密码框、文件上传全掌握08-前端表单验
  • 前端表单验证终极指南：HTML5 内置验证 + JavaScript 自定义校验 吴师兄大模型 前端html5javascripthtml表单验证内置验证自定义校验
    系列文章目录01-从零开始学HTML：构建网页的基本框架与技巧02-HTML常见文本标签解析：从基础到进阶的全面指南03-HTML从入门到精通：链接与图像标签全解析04-HTML列表标签全解析：无序与有序列表的深度应用05-HTML表格标签全面解析：从基础到高级优化技巧06-HTML表单深度解析：GET和POST提交方法07-HTML表单控件类型大全：文本框、密码框、文件上传全掌握08-前端表单验
  • 【自学笔记】Web前端的重点知识点-持续更新 Long_poem 笔记前端
    提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录Web前端知识点一、HTML基础二、CSS样式三、JavaScript基础四、前端框架与库五、前端工具与构建六、前端性能优化七、响应式设计与适配八、前端安全总结Web前端知识点一、HTML基础常用标签超链接(标签)图片(标签)表格(、、等标签)列表(无序列表、有序列表、定义列表)HTML5新特性语义化标签(、、等)音频视频(、
  • HTML5+SVG+CSS3 雪中点亮的圣诞树 坏男孩！ css3html5css
    HTML5+SVG+CSS3雪中点亮的圣诞树源码下载地址：HTML5+SVG+CSS3雪中点亮的圣诞树css3：body{background:-webkit-linear-gradient(top,#235,#22240%,#fff50%,#fff);background:linear-gradient(tobottom,#235,#22240%,#fff50%,#fff);overflow:h
  • solr 的admin.html 详细使用讲解 qq_37300675 solr
    爱雨轩真正的爱情，就像花朵，开放的地方越贫瘠，越是美丽动人！目录视图摘要视图订阅征文|从高考，到程序员深度学习与TensorFlow入门一课搞定！每周荐书|Web扫描、HTML5、Python（评论送书）solr管理界面详解标签：solrsolr管理界面solrqueryanalysis2016-08-0210:425117人阅读评论(0)收藏举报本文章已收录于：分类：Solr（8）作者同类文章X
  • HTML基础与进阶技术指南 王奥雷
    本文还有配套的精品资源，点击获取简介：HTML是构建网页的基础语言，负责定义网页的内容结构和样式。初学者需要掌握HTML元素、属性、结构等基础知识，并了解HTML5新增的语义化标签，表单元素的使用，布局与定位技术，响应式设计原则，以及如何与JavaScript交互。此外，学习SEO优化和无障碍性设计也是提高网页质量和可访问性的关键。本指南旨在引导初学者从基础到高级技巧，逐步深入理解并实践网页开发。
  • 深入剖析 HTML5 新特性：语义化标签和表单控件完全指南 吴师兄大模型 html5前端html语义化标签表单控件HTML5编程
    系列文章目录01-从零开始学HTML：构建网页的基本框架与技巧02-HTML常见文本标签解析：从基础到进阶的全面指南03-HTML从入门到精通：链接与图像标签全解析04-HTML列表标签全解析：无序与有序列表的深度应用05-HTML表格标签全面解析：从基础到高级优化技巧06-HTML表单深度解析：GET和POST提交方法07-HTML表单控件类型大全：文本框、密码框、文件上传全掌握08-前端表单验
  • 如何使用 HTML5 的 Canvas 实现动画效果？ 破碎的天堂鸟 学习教程html5前端html
    要使用HTML5的Canvas实现动画效果，可以遵循以下步骤和方法：1：创建Canvas元素：首先，在HTML文档中创建一个元素，用于显示动画。2：获取Canvas上下文：使用JavaScript获取Canvas的2D渲染上下文，以便进行绘图操作。varcanvas=document.getElementById("myCanvas");varctx=canvas.getContext("2d")
  • HTML5 性能优化和计算机硬件使用 天涯学馆 大前端&移动端全栈架构html5性能优化前端
    目录启用硬件加速图像与媒体优化资源加载与缓存CSS与布局优化JavaScript性能优化浏览器兼容性与特性检测启用硬件加速Canvas绘图<
  • HTML5 通信方式及应用 天涯学馆 大前端&移动端全栈架构html5前端html
    目录postMessageAPIWebSocketsServer-SentEvents(SSE)FetchAPI/XMLHttpRequest(XHR)WebWorkers&ServiceWorkersHTML5提供了多种通信方式，使得浏览器中的Web应用能够实现页面间、窗口间、甚至与外部服务的有效通信。这些通信方式大大提升了Web应用的交互性和复杂性，为构建现代、富客户端Web应用奠定了基础。以
  • HTML5 WebGL技术应用 天涯学馆 大前端&移动端全栈架构前端html5html
    目录WebGL基础知识WebGL库WebGL学习资料大型WebGL应用WebGL基础知识前端开发基础：熟悉HTML、CSS和JavaScript。数学基础：了解向量、矩阵运算、线性代数和基本几何概念。图形学基础：掌握基本的计算机图形学原理，如光照、纹理、变换、投影等。WebGLAPI的基本使用，包括创建画布、着色器、程序、缓冲区等。了解WebGL的渲染过程和管道，包括顶点处理、三角形剪裁、光照、纹
  • HTML5 MathML用法详解 天涯学馆 大前端&移动端全栈架构html5前端html
    目录MathML的基本结构MathML元素分类浏览器支持与渲染MathML与LaTeXMathML示例MathML是一种标记语言，用于在网页中表示数学公式和符号。它为数学、科学和技术出版物提供了标准化的、结构化的表示方式，使得复杂的数学表达式能够被浏览器准确解析和渲染。MathML的基本结构MathML文档由元素包裹，内部包含数学公式的所有组成部分。一个简单的MathML公式示例：
  • HTML5 Canvas图形绘制技术应用 天涯学馆 大前端&移动端全栈架构html5前端html
    HTML5Canvas图形绘制技术应用目录Canvas基础知识基本绘图操作路径操作文本绘制图像绘制变换复合图形与剪切阴影
  • HTML5 拖拽API应用 天涯学馆 大前端&移动端全栈架构html5前端html
    HTML5拖拽API应用目录设置可拖动元素监听拖拽事件设置目标区域使用dataTransfer对象传递数据自定义拖动图像HTML5拖拽API允许开发者创建交互性强的web应用，让用户能够直接在浏览器中拖动元素，并将其放置到其他位置或目标元素上。设置可拖动元素要使一个HTML元素可拖动，需要为其添加draggable=“true”属性。Dragme!监听拖拽事件可拖动元素上可以绑定以下拖拽相关事件的
  • HTML5 本地数据库及应用 天涯学馆 大前端&移动端全栈架构html5数据库前端
    HTML5本地数据库及应用目录WebSQL数据库创建与打开执行SQL插入、查询、更新、删除数据事务处理限制与弃用IndexDB打开数据库创建/修改对象插入数据查询数据更新和删除数据索引优化查询WebSQLWebSQL是HTML5规范中提出的一种基于SQL的客户端数据库存储技术，允许在浏览器端创建和操作关系型数据库。尽管WebSQL曾被纳入HTML5草案，但由于种种原因（如标准化进程停滞、缺乏跨浏览
  • html自学学多久,HTML和CSS要学多久？ 入门需要多长时间？ 安检 html自学学多久
    HTML和CSS要学多久？相信很多想要学习网页前端开发的小伙伴都会有这个疑问，今天W3Cschool小编就来和大家探讨一下这个问题。作为Web前端开发的基础，HTML和CSS是都是非常基础的语言，但是想要以此为工作的话，只是掌握HTML和CSS还是不够的，JS也需要学习。这样还不够，最好还能花一些时间学习一下近几年非常火的HTML5和CSS3，这样才能算是完全掌握了Web前端相关技术。如果单说HT
  • 基于Bootstrap 3可预览的HTML5文件上传插件 �时过境迁，物是人非 bootstraphtml5okhttp
    bootstrap-fileinput是一款基于Bootstrap3.x的HTML5文件上传插件。该文件上传插件带有预览图效果，可同时选择多个文件。该插件使用bootstrapCSS3样式来制作文件上传界面，美观大方。并且它提供了多国语言，你可以选择使用中文。在线预览下载该文件上传插件比普通的文件上传插件功能更强大，它可以对图片、文本文件、HTML文件、视频文件、音频文件、flash文件生成预览图
  • jQuery可选择日期范围的日期选择器插件 �时过境迁，物是人非 jquery前端javascript
    jQueryDateRangePicker是一款允许用户选择一个日期时间范围的jQuery日期选择器插件。整个日期选择器插件使用CSS来渲染样式，可以非常容易的使用CSS来定制它的皮肤。它的兼容性非常好，支持IE6+的IE浏览器。预览下载该日期选择器的特点有：支持IE6+,Firefox,Chrome,Safari和其他标准的HTML5浏览器。支持多种语言。使用CSS来渲染样式。容易使用和定制。支
  • 情人节用js写一个爱心代码 金刚廉神兽 javascript前端htmlhtml5开发语言
    情人节快乐！你可以用JavaScript写一个简单的爱心代码。以下是一个示例代码，使用HTML5canvas绘制一个爱心图形：LoveHeartvarcanvas=document.getElementById("loveHeart");varctx=canvas.getCon
  • 100行Html5+CSS3+JS代码实现元旦倒计时界面 2401_89828732 html5css3javascript
    1.下载VSCode下载链接：VSCode在Hbuilder、idea运行也是可以的，这里推荐使用VSCode2.配置插件三个插件对应的功能：改写标签后自动完善切换成中文页面让代码在网页中打开，默认键Alt+B3.构建三个文件在桌面新建一个空的文件夹，用VSCode打开在VSCode新建三个文件index.htmlstyle.cssscript.js（文件名字要和这个一样，不然会出错），把上面的图
  • 2025蛇年喜庆HTML5代码 学习&实践爱好者 HTML5与CSS3JavaScrip技术编程实践系列html5前端html
    2025蛇年喜庆HTML5代码以下是一个简单的HTML5+CSS+JavaScript代码示例，用于庆祝2025年蛇年。先看效果图：源码如下：2025年蛇年快乐！body{font-family:'Arial',sans-serif;background-color:#0a0a23;/*深蓝色背景*/color:#ffffff;/*白色文字*/text-align:center;margin:0;
  • pdfjs转图片_PDF转图片，在线PDF转JPG/PNG 诡道荒行 pdfjs转图片
    原理使用pdf.js预览图片，pdf.js将pdf通过canvas将每一页渲染出来，然后我们通过canvas的toDataURL方法保存为jpg或png格式。pdf.js是Mozilla开源的一个js库，无需任何本地支持就可以在浏览器上显示pdf文档。唯一的要求就是浏览器必须支持HTML5。依赖需要pdf.min.js和pdf.worker.min.js两个js文件全部代码实现pdfjsLib.G
  • pdfjs转图片_PDF转图片，PDF转JPG/PNG，完全由JS实现-阿里云开发者社区 陈紫璇 pdfjs转图片
    原理使用pdf.js预览图片，pdf.js将pdf通过canvas将每一页渲染出来，然后我们通过canvas的toDataURL方法保存为jpg或png格式。pdf.js是Mozilla开源的一个js库，无需任何本地支持就可以在浏览器上显示pdf文档。唯一的要求就是浏览器必须支持HTML5。依赖需要pdf.min.js和pdf.worker.min.js两个js文件全部代码实现pdfjsLib.G
  • html5 h265播放器,PC端播放H265 健康和谐男哥 html5h265播放器
    说明需要在PC端浏览器(Chrome)中播放直播视频，视频格式有H264/H265。有不少三方库可以实现。通过video.js(支持H264，不支持H265)videojs-contrib-hlsembedVideo.jsExampleEmbeddata-setup='{}'>参考地址：通过hls.js(支持H264，不支持H265)pcplaym3u8(hlsjs)video{width:600
  • html5 webgl stl,新闻|Babylon.js|Babylon.js教程|Babylon.js开发|Babylon.js制作|webgl|three.js|html53D可视化开发... miao君 html5webglstl
    4.0.0主要更新添加了对ammo.js的支持，作为物理插件(复合对象，电机，关节)(TrevorDev)Added在ammo.js物理插件中增加了对3D软体，2D布和1D绳索的软体的支持(JohnK)添加了AmmoJSPlugin场景文件加载器(MackeyK24)添加了对WebXR支持(TrevorDev)添加customAnimationFrameRequester以允许会话挂钩到引擎的渲染
  • 怎么创建一个能在线测试php的html5网页？ 很酷的站长 编程记录html5专题php专题phphtml5开发语言
    代码示例：一、搭建服务器环境首先，你需要在服务器上搭建PHP运行环境。如果你使用的是Linux服务器，可以使用Apache或Nginx作为Web服务器，并安装PHP解释器。对于Windows服务器，可以使用WAMP（Windows,Apache,MySQL,PHP）或XAMPP等集成环境。二、创建HTML表单页面创建一个HTML页面，包含一个表单，用户可以在表单中输入PHP代码，将该代码提交到服务
  • 一个简单的html5导航页面 很酷的站长 html5专题html5前端html
    一个简单的HTML5导航页面的示例代码：html简单导航页面/*样式部分*/body{font-family:Arial,sans-serif;margin:0;padding:0;background-color:#f4f4f4;}nav{background-color:#333;overflow:hidden;}nava{float:left;display:block;color:whit
  • Js函数返回值 _wy_ jsreturn
    一、返回控制与函数结果，语法为：return 表达式;作用: 结束函数执行，返回调用函数，而且把表达式的值作为函数的结果 二、返回控制语法为：return;作用: 结束函数执行，返回调用函数，而且把undefined作为函数的结果 在大多数情况下,为事件处理函数返回false,可以防止默认的事件行为.例如,默认情况下点击一个<a>元素,页面会跳转到该元素href属性
  • MySQL 的 char 与 varchar bylijinnan mysql
    今天发现，create table 时，MySQL 4.1有时会把 char 自动转换成 varchar 测试举例： CREATE TABLE `varcharLessThan4` ( `lastName` varchar(3) ) ; mysql> desc varcharLessThan4; +----------+---------+------+-
  • Quartz——TriggerListener和JobListener eksliang TriggerListenerJobListenerquartz
    转载请出自出处：http://eksliang.iteye.com/blog/2208624 一.概述 listener是一个监听器对象，用于监听scheduler中发生的事件，然后执行相应的操作；你可能已经猜到了，TriggerListeners接受与trigger相关的事件，JobListeners接受与jobs相关的事件。   二.JobListener监听器  j
  • oracle层次查询 18289753290 oracle；层次查询；树查询
    .oracle层次查询(connect  by) oracle的emp表中包含了一列mgr指出谁是雇员的经理，由于经理也是雇员，所以经理的信息也存储在emp表中。这样emp表就是一个自引用表，表中的mgr列是一个自引用列，它指向emp表中的empno列，mgr表示一个员工的管理者， select   empno,mgr,ename,sal  from e
  • 通过反射把map中的属性赋值到实体类bean对象中 酷的飞上天空 javaee泛型类型转换
    使用过struts2后感觉最方便的就是这个框架能自动把表单的参数赋值到action里面的对象中 但现在主要使用Spring框架的MVC，虽然也有@ModelAttribute可以使用但是明显感觉不方便。 好吧，那就自己再造一个轮子吧。 原理都知道，就是利用反射进行字段的赋值，下面贴代码 主要类如下：   import java.lang.reflect.Field; imp
  • SAP HANA数据存储：传统硬盘的瓶颈问题 蓝儿唯美 HANA
    SAPHANA平台有各种各样的应用场景，这也意味着客户的实施方法有许多种选择，关键是如何挑选最适合他们需求的实施方案。 在 《Implementing SAP HANA》这本书中，介绍了SAP平台在现实场景中的运作原理，并给出了实施建议和成功案例供参考。本系列文章节选自《Implementing SAP HANA》，介绍了行存储和列存储的各自特点，以及SAP HANA的数据存储方式如何提升空间压
  • Java Socket 多线程实现文件传输 随便小屋 javasocket
            高级操作系统作业，让用Socket实现文件传输，有些代码也是在网上找的，写的不好，如果大家能用就用上。 客户端类：   package edu.logic.client; import java.io.BufferedInputStream; import java.io.Buffered
  • java初学者路径 aijuans java
    学习Java有没有什么捷径?要想学好Java，首先要知道Java的大致分类。自从Sun推出Java以来，就力图使之无所不包，所以Java发展到现在，按应用来分主要分为三大块：J2SE,J2ME和J2EE,这也就是Sun ONE(Open Net Environment)体系。J2SE就是Java2的标准版，主要用于桌面应用软件的编程；J2ME主要应用于嵌入是系统开发，如手机和PDA的编程；J2EE
  • APP推广 aoyouzi APP推广
    一，免费篇 1，APP推荐类网站自主推荐 最美应用、酷安网、DEMO8、木蚂蚁发现频道等,如果产品独特新颖，还能获取最美应用的评测推荐。PS：推荐简单。只要产品有趣好玩，用户会自主分享传播。例如足迹APP在最美应用推荐一次，几天用户暴增将服务器击垮。 2，各大应用商店首发合作 老实盯着排期，多给应用市场官方负责人献殷勤。 3，论坛贴吧推广 百度知道，百度贴吧，猫扑论坛，天涯社区，豆瓣（
  • JSP转发与重定向 百合不是茶 jspservletJava Webjsp转发
      在servlet和jsp中我们经常需要请求,这时就需要用到转发和重定向;   转发包括;forward和include     例子;forwrad转发;  将请求装法给reg.html页面   关键代码;    req.getRequestDispatcher("reg.html
  • web.xml之jsp-config bijian1013 javaweb.xmlservletjsp-config
    1.作用：主要用于设定JSP页面的相关配置。 2.常见定义： <jsp-config> <taglib> <taglib-uri>URI(定义TLD文件的URI,JSP页面的tablib命令可以经由此URI获取到TLD文件)</tablib-uri> <taglib-location> TLD文件所在的位置
  • JSF2.2 ViewScoped Using CDI sunjing CDIJSF 2.2ViewScoped
    JSF 2.0 introduced annotation @ViewScoped; A bean annotated with this scope maintained its state as long as the user stays on the same view(reloads or navigation - no intervening views). One problem w
  • 【分布式数据一致性二】Zookeeper数据读写一致性 bit1129 zookeeper
    很多文档说Zookeeper是强一致性保证，事实不然。关于一致性模型请参考http://bit1129.iteye.com/blog/2155336    Zookeeper的数据同步协议 Zookeeper采用称为Quorum Based Protocol的数据同步协议。假如Zookeeper集群有N台Zookeeper服务器(N通常取奇数，3台能够满足数据可靠性同时
  • Java开发笔记 白糖_ java开发
    1、Map<key,value>的remove方法只能识别相同类型的key值   Map<Integer,String> map = new HashMap<Integer,String>(); map.put(1,"a"); map.put(2,"b"); map.put(3,"c"
  • 图片黑色阴影 bozch 图片
     .event{ padding:0;    width:460px;    min-width: 460px;    border:0px solid #e4e4e4;    height: 350px;    min-heig
  • 编程之美-饮料供货-动态规划 bylijinnan 动态规划
    import java.util.Arrays; import java.util.Random; public class BeverageSupply { /** * 编程之美 饮料供货 * 设Opt（V’，i）表示从i到n-1种饮料中，总容量为V’的方案中，满意度之和的最大值。 * 那么递归式就应该是：Opt（V’，i）=max{ k * Hi+Op
  • ajax大参数（大数据）提交性能分析 chenbowen00 WebAjax框架浏览器prototype
    近期在项目中发现如下一个问题 项目中有个提交现场事件的功能，该功能主要是在web客户端保存现场数据（主要有截屏，终端日志等信息）然后提交到服务器上方便我们分析定位问题。客户在使用该功能的过程中反应点击提交后反应很慢，大概要等10到20秒的时间浏览器才能操作，期间页面不响应事件。 根据客户描述分析了下的代码流程，很简单，主要通过OCX控件截屏，在将前端的日志等文件使用OCX控件打包，在将之转换为
  • [宇宙与天文]在太空采矿,在太空建造 comsci
         我们在太空进行工业活动...但是不太可能把太空工业产品又运回到地面上进行加工,而一般是在哪里开采,就在哪里加工,太空的微重力环境,可能会使我们的工业产品的制造尺度非常巨大....      地球上制造的最大工业机器是超级油轮和航空母舰,再大些就会遇到困难了,但是在空间船坞中,制造的最大工业机器,可能就没
  • ORACLE中CONSTRAINT的四对属性 daizj oracleCONSTRAINT
    ORACLE中CONSTRAINT的四对属性 summary:在data migrate时,某些表的约束总是困扰着我们,让我们的migratet举步维艰,如何利用约束本身的属性来处理这些问题呢?本文详细介绍了约束的四对属性: Deferrable/not deferrable, Deferred/immediate, enalbe/disable, validate/novalidate,以及如
  • Gradle入门教程 dengkane gradle
    一、寻找gradle的历程 一开始的时候，我们只有一个工程，所有要用到的jar包都放到工程目录下面，时间长了，工程越来越大，使用到的jar包也越来越多，难以理解jar之间的依赖关系。再后来我们把旧的工程拆分到不同的工程里，靠ide来管理工程之间的依赖关系，各工程下的jar包依赖是杂乱的。一段时间后，我们发现用ide来管理项程很不方便，比如不方便脱离ide自动构建，于是我们写自己的ant脚本。再后
  • C语言简单循环示例 dcj3sjt126com c
    # include <stdio.h> int main(void) { int i; int count = 0; int sum = 0; float avg; for (i=1; i<=100; i++) { if (i%2==0) { count++; sum += i; } } avg
  • presentModalViewController 的动画效果 dcj3sjt126com controller
    系统自带(四种效果)： presentModalViewController模态的动画效果设置：     [cpp]  view plain copy   UIViewController *detailViewController = [[UIViewController al
  • java 二分查找 shuizhaosi888 二分查找java二分查找
    需求：在排好顺序的一串数字中，找到数字T   一般解法：从左到右扫描数据，其运行花费线性时间O(N)。然而这个算法并没有用到该表已经排序的事实。 /** * * @param array * 顺序数组 * @param t * 要查找对象 * @return */ public stati
  • Spring Security（07）——缓存UserDetails 234390216 ehcache缓存Spring Security
           Spring Security提供了一个实现了可以缓存UserDetails的UserDetailsService实现类，CachingUserDetailsService。该类的构造接收一个用于真正加载UserDetails的UserDetailsService实现类。当需要加载UserDetails时，其首先会从缓存中获取，如果缓存中没
  • Dozer 深层次复制 jayluns VOmavenpo
    最近在做项目上遇到了一些小问题，因为架构在做设计的时候web前段展示用到了vo层，而在后台进行与数据库层操作的时候用到的是Po层。这样在业务层返回vo到控制层，每一次都需要从po-->转化到vo层，用到BeanUtils.copyProperties(source, target)只能复制简单的属性，因为实体类都配置了hibernate那些关联关系，所以它满足不了现在的需求，但后发现还有个很
  • CSS规范整理（摘自懒人图库） a409435341 htmlUIcss浏览器
       刚没事闲着在网上瞎逛，找了一篇CSS规范整理，粗略看了一下后还蛮有一定的道理，并自问是否有这样的规范，这也是初入前端开发的人一个很好的规范吧。 一、文件规范 1、文件均归档至约定的目录中。 具体要求通过豆瓣的CSS规范进行讲解： 所有的CSS分为两大类：通用类和业务类。通用的CSS文件，放在如下目录中： 基本样式库 /css/core
  • C++动态链接库创建与使用 你不认识的休道人 C++dll
    一、创建动态链接库 1.新建工程test中选择”MFC [dll]”dll类型选择第二项"Regular DLL With MFC shared linked"，完成 2.在test.h中添加 extern “C” 返回类型 _declspec(dllexport)函数名(参数列表); 3.在test.cpp中最后写 extern “C” 返回类型 _decls
  • Android代码混淆之ProGuard rensanning ProGuard
    Android应用的Java代码，通过反编译apk文件（dex2jar、apktool）很容易得到源代码，所以在release版本的apk中一定要混淆一下一些关键的Java源码。 ProGuard是一个开源的Java代码混淆器（obfuscation）。ADT r8开始它被默认集成到了Android SDK中。 官网： http://proguard.sourceforge.net/
  • 程序员在编程中遇到的奇葩弱智问题 tomcat_oracle jquery编程ide
    　　现在收集一下：       　　排名不分先后，按照发言顺序来的。   1、Jquery插件一个通用函数一直报错，尤其是很明显是存在的函数，很有可能就是你没有引入jquery。。。或者版本不对 2、调试半天没变化：不在同一个文件中调试。这个很可怕，我们很多时候会备份好几个项目，改完发现改错了。有个群友说的好：   在汤匙
  • 解决maven-dependency-plugin (goals "copy-dependencies","unpack") is not supported xp9802 dependency
    解决办法：在plugins之前添加如下pluginManagement，二者前后顺序如下：   [html]  view plain copy   <build>           <pluginManagement