js画图开发库--mxgraph--[stencils-形状可变.html]

最新推荐文章于 2024-05-29 09:45:37 发布

iteye_17920

最新推荐文章于 2024-05-29 09:45:37 发布

阅读量719

点赞数

分类专栏： mxgraph 文章标签： js画图开发库 mxgraph stencils 形状可变

本文链接：https://blog.csdn.net/iteye_17920/article/details/82480444

版权

本文介绍如何利用mxgraph这个JavaScript图形库，通过stencils技术来实现图形的自定义和形状变化，从而创建出功能丰富的交互式画图应用。

摘要由CSDN通过智能技术生成

js画图开发库--mxgraph--[stencils-形状可变.html

<!Doctype html>
<html xmlns=http://www.w3.org/1999/xhtml>
	<head>
	<meta http-equiv=Content-Type content="text/html;charset=utf-8">
	<title>形状可变</title>

	<!-- 如果本文件的包与src不是在同一个目录,就要将basepath设置到src目录下 -->
	<script type="text/javascript">
		mxBasePath = '../src';
	</script>

	<!-- 引入支持库文件 -->
	<script type="text/javascript" src="../src/js/mxClient.js"></script>

	<!-- 示例代码 -->
	<script type="text/javascript">
		//  程序在此方法中启动 
		function main(container)
		{
			// 检查浏览器支持
			if (!mxClient.isBrowserSupported())
			{
				mxUtils.error('Browser is not supported!', 200, false);
			}
			else
			{
				// 去锯齿效果
				mxRectangleShape.prototype.crisp = true;
				
				// 设置全局阴影的颜色
				mxConstants.SHADOWCOLOR = '#C0C0C0';
				mxConstants.SHADOW_OPACITY = 0.5;
				mxConstants.SHADOW_OFFSET_X = 4;
				mxConstants.SHADOW_OFFSET_Y = 4;
				
				// 使用的形状，大小调整预览
				mxVertexHandler.prototype.createSelectionShape = function(bounds)
				{
					var key = this.state.style[mxConstants.STYLE_SHAPE];
					var stencil = mxStencilRegistry.getStencil(key);
					var shape = null;
					
					if (stencil != null)
					{
						shape =

最低0.47元/天解锁文章

iteye_17920

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
js画图开发库--mxgraph--[stencils-形状可变.html]

js画图开发库--mxgraph--[stencils-形状可变.html &lt;!Doctype html&gt;&lt;html xmlns=http://www.w3.org/1999/xhtml&gt; &lt;head&gt; &lt;meta http-equiv=Content-Type content="text/html;charset=utf...
复制链接

扫一扫

专栏目录