mxGraph学习一—— helloworld例子解读

mxGraph从helloworld开始学习

helloword文件在源码的路径:
mxgraph-master\javascript\examples\helloworld.html

mxGraph中的Hello World,是一个简单的客户端的例子,显示了两个相连的“Hello”和“世界”的顶点标签。 这个例子演示了以下几件事:

  1. 创建一个嵌入了mxGraph客户端JavaScript的HTML页面;
  2. 创建了一个容器(即一个div节点)来装载mxGraph;
  3. 在图形mxGraph中加入所需的元素-顶点和边。
<!--
  Copyright (c) 2006-2018, JGraph Ltd
  
  Hello, World! example for mxGraph. This example demonstrates using
  a DOM node to create a graph and adding vertices and edges.
  该例子描述了如何使用一个节点,创建一个图片,并添加顶点和边
-->
<html>
<head>
	<title>Hello, World! example for mxGraph</title>

	<!-- Sets the basepath for the library if not in same directory
	如果不在相同路径,需要设置basepath为开发库的路径。
	maxBasepath用来定义css、图片、资源和js的使用目录。
	必须加载在mxClient.js之前,而且不应该斜线 -->
	<script type="text/javascript">
		mxBasePath = '../src';
	</script>

	<!-- Loads and initializes the library 加载并初始化开发库,mxGraph库的路径-->
	<!--mxClient.js是一个包含所有的mxGraph源代码的JavaScript文件。
	从Web服务器下载时, 获得包含所有的JavaScript的单个文件,
	要比分成多个独立文件要快得多,这是由于每个文件 都具有独立的请求/确认开销。
	无论服务器对于一个客户的并行接口的能力差异有多大,速度的 提升通常至少是两倍以上。-->
	<script type="text/javascript" src="../src/js/mxClient.js"></script>

	<!-- Example code -->
	<script type="text/javascript">
		// Program starts here. Creates a sample graph in the
		// DOM node with the specified ID. This function is invoked
		// from the onLoad event 
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值