1、如果需要将label靠左边对齐,则必须重写底层源码

新增mxText的一个构造器,主要是增加了一个参数:x(代表当前的cell)

 function mxText(a, b, c, d, e, f, g, h, k, i, l, m, n, o, p, q, t, u, v, w, x) {
this.value = a;
this.bounds = b;
this.color = e != null ? e : "black";
this.align = c != null ? c : "";
this.valign = d != null ? d : "";
this.family = f != null ? f : mxConstants.DEFAULT_FONTFAMILY;
this.size = g != null ? g : mxConstants.DEFAULT_FONTSIZE;
this.fontStyle = h != null ? h : 0;
this.spacing = 0;
this.spacingTop = 0;
//this.spacingRight = x.cell.geometry.height/2 - (this.size * 1.25 * a.length);
this.spacingRight = 0;
this.spacingBottom = 0;
this.spacingLeft = 0;
this.horizontal = true;
this.background = p;
this.border = q;
this.wrap = t != null ? t : false;
this.clipped = u != null ? u : false;
this.overflow = v != null ? v : "visible";
this.labelPadding = w != null ? w : 0
}

重写createTabel方法

 mxCellRenderer.prototype.createLabel = function(a, b) {
var c = a.view.graph;
c.getModel().isEdge(a.cell);
if (a.style[mxConstants.STYLE_FONTSIZE] > 0 || a.style[mxConstants.STYLE_FONTSIZE] == null) {
var d = (c.isHtmlLabel(a.cell) || b != null && mxUtils.isNode(b)) && c.dialect == mxConstants.DIALECT_SVG;
//alert(a.cell.value + '-' + b);
//dongyj add :其中b=a.cell.value
if (!a.cell.id && a.cell.id.indexOf("_swimlane") >= 0 && b) {
a.text = new mxText(b, new mxRectangle, a.style[mxConstants.STYLE_ALIGN] || mxConstants.ALIGN_CENTER, c.getVerticalAlign(a), a.style[mxConstants.STYLE_FONTCOLOR], a.style[mxConstants.STYLE_FONTFAMILY], a.style[mxConstants.STYLE_FONTSIZE],
a.style[mxConstants.STYLE_FONTSTYLE], a.style[mxConstants.STYLE_SPACING], a.style[mxConstants.STYLE_SPACING_TOP], a.style[mxConstants.STYLE_SPACING_RIGHT], a.style[mxConstants.STYLE_SPACING_BOTTOM], a.style[mxConstants.STYLE_SPACING_LEFT], a.style[mxConstants.STYLE_HORIZONTAL], a.style[mxConstants.STYLE_LABEL_BACKGROUNDCOLOR], a.style[mxConstants.STYLE_LABEL_BORDERCOLOR], c.isWrapping(a.cell) && c.isHtmlLabel(a.cell), c.isLabelClipped(a.cell), a.style[mxConstants.STYLE_OVERFLOW], a.style[mxConstants.STYLE_LABEL_PADDING], a);
} else {
//alert(a.cell.geometry.width);
//a.cell.geometry.height; a.text = new mxText(b, new mxRectangle, a.style[mxConstants.STYLE_ALIGN] || mxConstants.ALIGN_CENTER, c.getVerticalAlign(a), a.style[mxConstants.STYLE_FONTCOLOR], a.style[mxConstants.STYLE_FONTFAMILY], a.style[mxConstants.STYLE_FONTSIZE],
a.style[mxConstants.STYLE_FONTSTYLE], a.style[mxConstants.STYLE_SPACING], a.style[mxConstants.STYLE_SPACING_TOP], a.style[mxConstants.STYLE_SPACING_RIGHT], a.style[mxConstants.STYLE_SPACING_BOTTOM], a.style[mxConstants.STYLE_SPACING_LEFT], a.style[mxConstants.STYLE_HORIZONTAL], a.style[mxConstants.STYLE_LABEL_BACKGROUNDCOLOR], a.style[mxConstants.STYLE_LABEL_BORDERCOLOR], c.isWrapping(a.cell) && c.isHtmlLabel(a.cell), c.isLabelClipped(a.cell), a.style[mxConstants.STYLE_OVERFLOW], a.style[mxConstants.STYLE_LABEL_PADDING], a);
}
a.text.opacity = a.style[mxConstants.STYLE_TEXT_OPACITY];
a.text.dialect = d ? mxConstants.DIALECT_STRICTHTML : a.view.graph.dialect;
this.initializeLabel(a);
var e = false,
f = function(b) {
var d = a;
if (mxClient.IS_TOUCH || e) {
d = mxEvent.getClientX(b);
b = mxEvent.getClientY(b);
b = mxUtils.convertPoint(c.container, d, b);
d = c.view.getState(c.getCellAt(b.x, b.y))
}
return d
},
d = mxClient.IS_TOUCH ? "touchmove" : "mousemove",
g = mxClient.IS_TOUCH ? "touchend" : "mouseup";
mxEvent.addListener(a.text.node, mxClient.IS_TOUCH ? "touchstart" : "mousedown", mxUtils.bind(this, function(b) {
if (this.isLabelEvent(a, b)) {
c.fireMouseEvent(mxEvent.MOUSE_DOWN, new mxMouseEvent(b, a));
e = c.dialect != mxConstants.DIALECT_SVG && mxEvent.getSource(b).nodeName == "IMG"
}
}));
mxEvent.addListener(a.text.node, d, mxUtils.bind(this, function(b) {
this.isLabelEvent(a, b) && c.fireMouseEvent(mxEvent.MOUSE_MOVE, new mxMouseEvent(b, f(b)))
}));
mxEvent.addListener(a.text.node, g, mxUtils.bind(this, function(b) {
if (this.isLabelEvent(a, b)) {
c.fireMouseEvent(mxEvent.MOUSE_UP, new mxMouseEvent(b, f(b)));
e = false
}
}));
mxEvent.addListener(a.text.node, "dblclick", mxUtils.bind(this, function(b) {
if (this.isLabelEvent(a, b)) {
c.dblClick(b, a.cell);
mxEvent.consume(b)
}
}))
}
};

如果要求泳道的label居中,则不需要重写底层方法,只需要重写createLabel方法即可

 mxCellRenderer.prototype.createLabel = function(a, b) {
var c = a.view.graph;
c.getModel().isEdge(a.cell);
if (a.style[mxConstants.STYLE_FONTSIZE] > 0 || a.style[mxConstants.STYLE_FONTSIZE] == null) {
var d = (c.isHtmlLabel(a.cell) || b != null && mxUtils.isNode(b)) && c.dialect == mxConstants.DIALECT_SVG; /*****************泳道图样式修改start*******************/ var tempSwinlaneHorizontal = a.style[mxConstants.STYLE_HORIZONTAL];
if(c.isSwimlane(a.cell)){
tempsHorizontal = true;
} var tempSwinlaneVertical = c.getVerticalAlign(a);
if(c.isSwimlane(a.cell)){
tempSwinlaneVertical = 'middle';
}
/*****************泳道图样式修改end*******************/ a.text = new mxText(b, new mxRectangle, a.style[mxConstants.STYLE_ALIGN] || mxConstants.ALIGN_CENTER, tempSwinlaneVertical, a.style[mxConstants.STYLE_FONTCOLOR], a.style[mxConstants.STYLE_FONTFAMILY], a.style[mxConstants.STYLE_FONTSIZE],
a.style[mxConstants.STYLE_FONTSTYLE], a.style[mxConstants.STYLE_SPACING], a.style[mxConstants.STYLE_SPACING_TOP], a.style[mxConstants.STYLE_SPACING_RIGHT], a.style[mxConstants.STYLE_SPACING_BOTTOM], a.style[mxConstants.STYLE_SPACING_LEFT], tempsHorizontal, a.style[mxConstants.STYLE_LABEL_BACKGROUNDCOLOR], a.style[mxConstants.STYLE_LABEL_BORDERCOLOR], c.isWrapping(a.cell) && c.isHtmlLabel(a.cell), c.isLabelClipped(a.cell), a.style[mxConstants.STYLE_OVERFLOW], a.style[mxConstants.STYLE_LABEL_PADDING]);
a.text.opacity = a.style[mxConstants.STYLE_TEXT_OPACITY];
a.text.dialect = d ? mxConstants.DIALECT_STRICTHTML : a.view.graph.dialect;
this.initializeLabel(a);
var e = false, f = function(b) {
var d = a;
if (mxClient.IS_TOUCH || e) {
d = mxEvent.getClientX(b);
b = mxEvent.getClientY(b);
b = mxUtils.convertPoint(c.container, d, b);
d = c.view.getState(c.getCellAt(b.x, b.y))
}
return d
}, d = mxClient.IS_TOUCH ? "touchmove" : "mousemove", g = mxClient.IS_TOUCH ? "touchend" : "mouseup";
mxEvent.addListener(a.text.node, mxClient.IS_TOUCH ? "touchstart" : "mousedown", mxUtils.bind(this, function(b) {
if (this.isLabelEvent(a, b)) {
c.fireMouseEvent(mxEvent.MOUSE_DOWN, new mxMouseEvent(b, a));
e = c.dialect != mxConstants.DIALECT_SVG && mxEvent.getSource(b).nodeName == "IMG"
}
}));
mxEvent.addListener(a.text.node, d, mxUtils.bind(this, function(b) {
this.isLabelEvent(a, b) && c.fireMouseEvent(mxEvent.MOUSE_MOVE, new mxMouseEvent(b, f(b)))
}));
mxEvent.addListener(a.text.node, g, mxUtils.bind(this, function(b) {
if (this.isLabelEvent(a, b)) {
c.fireMouseEvent(mxEvent.MOUSE_UP, new mxMouseEvent(b, f(b)));
e = false
}
}));
mxEvent.addListener(a.text.node, "dblclick", mxUtils.bind(this, function(b) {
if (this.isLabelEvent(a, b)) {
c.dblClick(b, a.cell);
mxEvent.consume(b)
}
}))
}
};

graph使泳道图的label横向显示的更多相关文章

  1. 关于echarts中的饼状图的label文字显示过长的问题

    label: { normal: { fontSize: 14, formatter(v) { let text = v.name let count = text.indexOf('¥') cons ...

  2. Paddle Graph Learning (PGL)图学习之图游走类模型[系列四]

    Paddle Graph Learning (PGL)图学习之图游走类模型[系列四] 更多详情参考:Paddle Graph Learning 图学习之图游走类模型[系列四] https://aist ...

  3. Flex中如何通过showAllDataTips属性使鼠标移动到图表时显示所有的数据Tips的例子

    原文 http://blog.minidx.com/2008/11/10/1616.html 接下来的例子演示了Flex中如何通过showAllDataTips属性,使鼠标移动到图表时显示所有的数据T ...

  4. ztree实现权限功能(横向显示)

    最近在做权限功能的时候,采用的ztree实现的,但是产品要求最后一层的权限节点要横向显示.开始在网上找的解决方案是用css样式把最后一层的display设置为inline.在我本地电脑上看了下.效果不 ...

  5. 用Visio画泳道图

    在一次会议中看到有个同事在讲解业务流程时画了一个与PD中很类似的泳道图,但是在图的左侧确有一个阶段的列,事后与他沟通,才知道他这个图是”拼”出来的,也就是说所有的图都是他一点点的在画图工具中做出来的. ...

  6. 怎样使MathType插入章节标记不显示

    作为专业的公式编辑器,MathType可以帮助大家在Word中插入数学公式,有的时候还需要插入章节标记,那么怎样使章节标记不显示呢?下面就教大家使MathType插入章节标记不显示的技巧. 实际问题如 ...

  7. ios label上显示特殊字符 % "

    今天在label上显示一个拼接的百分比 label.text = [NSString stringWithFormater:@"%d%",i]; 结果后面的%就是报错,然后查半天也 ...

  8. 小技巧,如何在Label中显示图片

    这个需求其实是有的,比如QQ聊天界面里面发送的信息,可以用label来显示文字(也可以用button显示),但是有时候用户可能会发送图片.如果能让Label遇到文字就显示文字,遇到图片就显示图片就好了 ...

  9. 8位灰度图在LCD上显示

    一.概述 1.灰度 灰度使用黑色调表示物体,即用黑色为基准色,不同的饱和度的黑色来显示图像.每个灰度对象都具有从 0%(白色)到灰度条100%(黑色)的亮度值. 使用黑白或灰度扫描仪生成的图像通常以灰 ...

随机推荐

  1. Object-c 单例模式中的 allocWithZone作用

    最 近因为在ios应用开发中,考虑到一些公共方法的封装使用,就决定使用单例模式的写法了..不知道,Object-c中的单例模式的写法是否和java中的写法是否有所区别? 于是阿堂从网上一搜,发现“ O ...

  2. H面试程序(12): 输出字符串中第一个只出现一次的字母

    题目描述: 若字符串str为'' sbdddsbfc'',则输出 f; 若字符串str为''aabbccdd'',则输出:字符串str中的字符都出现两次以上 #include <stdio.h& ...

  3. windows+Ubuntu双系统 windows引导修复

    我的博客:http://blog.csdn.net/muyang_ren 装完windows+Ubuntu麒麟双系统后,发现引导是Ubuntu的. Ubuntu的引导是GRUP windows的引导是 ...

  4. 【单调队列】【3-21个人赛】【problmeB】

    Problem B Time Limit : 4000/2000ms (Java/Other)   Memory Limit : 65535/32768K (Java/Other) Total Sub ...

  5. 推荐JVM的9款编程语言杀手开发利器

    随着各种各样的编程语言铺地盖地向我们涌来,软件世界似乎变得有点疯狂了.JVM的帝国在不断地壮大,它已经不满足于只作为Java语言的运行平台.它勇敢地将自己的触角伸向了JRuby,Groovy等等,未来 ...

  6. html网页获取php网页数据等知识记录

    所有跟php有关的网页都必须在Apache服务器下打开.需要配置好confg.ini的文件路径. AJAX: 通过事件不断的向服务器发送请求,然后服务器会时时返回最新的数据,这就是AJAX的功能 PS ...

  7. MySQL导入sql 文件的5大步骤

    http://database.51cto.com/art/201005/200739.htm 以下的文章主要介绍的是MySQL导入sql 文件,即MySQL数据库导入导出sql 文件的实际操作步骤, ...

  8. 数据库基础(变量、运算符、if语句、while语句)

    数据库基础(变量.运算符.if语句.while语句)   变量: 定义变量:declare @变量名 数据类型 变量赋值:set @变量名 = 值 输出:print 变量或字符串 SQL语言也跟其他编 ...

  9. UML中的交互图<转>

      转自>>http://blog.csdn.net/mingxuanyun/article/details/8572128 交互图用来描述系统中的对象是如何进行相互作用的,即一组对象是如 ...

  10. ffmpeg在Win7 VS2010中debug通过,release出错的问题解决方法

    我所用的系统环境是Win7 32位操作系统+VS2010编译环境.所以在debug模式下调通之后,在Release模式下调试不通过,最后通过上网查资料和自己对比两个编译选项得出以下结论: 修改“项目- ...