vis.js 头部日期实现国际化
2018-01-26 11:58
525 查看
如图:对头部实现国际化 如果是英文版本则切换成英文 如果是中文版本则切换成中文
![](http://img.blog.csdn.net/20180126112726775?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvenhmMTI0MjY1Mjg5NQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
1.需引入
2.
3.根据中英文判断
效果:中文版本
![](http://img.blog.csdn.net/20180126120042522?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvenhmMTI0MjY1Mjg5NQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
英文版本:
1.需引入
<script src="${pageContext.request.contextPath}/js/moment-with-locales.js"></script> <script src="js/vis.js"></script> <link href="css/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
2.
var optionsUS = { groupOrder: function (a, b) { return a.value - b.value; }, //添加进度条 visibleFrameTemplate: function(item) { if (item.visibleFrameTemplate) { return item.visibleFrameTemplate; } var percentage = item.value+ '%'; return '<div class="progress-wrapper"><div class="progress" style="width:' + percentage + '"></div><label class="progress-label">' + percentage + '<label></div>'; }, groupOrderSwap: function (a, b, groups) { var v = a.value; a.value = b.value; b.value = v; }, locale: moment.locale('en'), orientation: 'both', editable: false, tooltipOnItemUpdateTime: true, groupEditable: true, start: startTime, end:endTime }; //中文 var options = { groupOrder: function (a, b) { return a.value - b.value; }, //添加进度条 visibleFrameTemplate: function(item) { if (item.visibleFrameTemplate) { return item.visibleFrameTemplate; } var percentage = item.value+ '%'; return '<div class="progress-wrapper"><div class="progress" style="width:' + percentage + '"></div><label class="progress-label">' + percentage + '<label></div>'; }, groupOrderSwap: function (a, b, groups) { var v = a.value; a.value = b.value; b.value = v; }, orientation: 'both', locale: moment.locale('zh-cn'), editable: false, tooltipOnItemUpdateTime: true, groupEditable: true, start: startTime, end:endTime };
3.根据中英文判断
var timeline = new vis.Timeline(container); var lanageType=sessionStorage.getItem("sysManager_i18nLanauge");//获取国际化语言 if(lanageType=="zh"){ timeline.setOptions(options);//调用中文的options配置 }else{ timeline.setOptions(optionsUS);//调用英文的options配置 } timeline.setGroups(groups); timeline.setItems(items);
效果:中文版本
英文版本:
相关文章推荐
- 网站头部动态日期--JS实现
- js实现日期加减,求出时间差
- js将long日期格式转换为标准日期格式实现思路
- tornado实现在JS文件的国际化和静态文件的引用
- 利用Query+bootstrap和js两种方式实现日期选择器
- 纯JS实现出生日期[年月日]下拉菜单
- JS实现点击表头表格自动排序(含数字、字符串、日期)
- JS实现字符串转日期并比较大小实例分析
- Js 获取当前日期时间及其它操作实现代码
- 前台技术--js实现日期控件
- 利用Intellij+MAVEN+SpringMVC+URI.js实现页面的中英文切换(国际化)
- 计算日期间隔js实现
- js实现日期大写
- js 前端实现国际化配置
- 一个不错的js实现的 日期下拉菜单
- js获取日期、时间、日期常用方法、时间计算并格式化和实现电子表
- js实现调用调用设备的日期时间
- JS判断当前日期是否大于某个日期的实现代码
- 用JS实现获取当前日期
- JS实现日期时间动态显示的方法