關於echarts、layer.js和jqGrid的知識點
阿新 • • 發佈:2017-10-26
spa params h+ item getdate 正則 math grid 參數
使用echarts和layer.js直接去官方文檔,能解決大部分問題。
但是有些問題,解釋不夠清楚,在這裏記錄一下。
1、echarts的使用
第一點:關於echarts的labelline在數據為零的時候,不顯示的問題。
調整option裏面的data的內容為:
1 { 2 name : ‘xxx‘, 3 value:" + xxx + ", 4 itemStyle:{ 5 normal:{ 6 label:{ 7 show: true 8 },9 labelLine: { 10 show: true 11 } 12 } 13 } 14 }此處為C#代碼,可用循環來生成echarts需要的json,在原來的json類型中,加入itemStyle項,這樣就能夠調整label和labelLine,寫在其它地方不可以。
在取得echarts的option以後,用js,進行判斷是否顯示
1 var opt = option.series[0];//有可能有多個series,根據需要選擇調整哪個series 2 functionhidePieline(opt) { 3 jQuery.each(opt.data, function (i, item) { 4 if (item.value == 0) { 5 item.itemStyle.normal.labelLine.show = false; 6 item.itemStyle.normal.label.show = false; 7 } 8 }); 9 }
第二點:關於echarts的柱圖,點擊X軸label的問題
1 xAxis: [{ 2 type: ‘category‘, 3 data: arg.data.categories, 4 triggerEvent: true //在echart3中,設置triggerEvent為true即可。這樣柱子跟x軸label都可以點 5 }],
1 在echarts2中把clickable設為true的屬性 2 xAxis: [{ 3 type: ‘category‘, 4 data: datas[0].categories, 5 axisLabel:{ 6 clickable : true 7 } 8 }],
1 var xxx = echarts.init(document.getElementById(‘xxx‘)); 2 xxx.on(‘click‘, function (params) { 3 if (params.name == undefined) { 4 在這裏根據params來判斷是點擊的柱子還是x軸label,可以用params裏面的其他參數判斷,不一定用name 5 } else { 6 } 7 });
2、layer.js的使用。參看官方文檔即可。
3、jqGrid的使用
在使用jqGrid的時候,為colModel直接傳遞DateTime類型時,會直接識別為/Date(1446704778000)/,可以通過正則表達式來轉換
1 eval(rowObject.PlanFinishDate.replace(/\/Date\((\d+)\)\//gi, "new Date($1)")).format(‘yyyy-M-d‘);
format方式是用JS自定義的方法
1 Date.prototype.format = function (fmt) { 2 var o = { 3 "M+": this.getMonth() + 1, //月份 4 "d+": this.getDate(), //日 5 "h+": this.getHours(), //小時 6 "m+": this.getMinutes(), //分 7 "s+": this.getSeconds(), //秒 8 "q+": Math.floor((this.getMonth() + 3) / 3), //季度 9 "S": this.getMilliseconds() //毫秒 10 }; 11 fmt = fmt || "yyyy-MM-dd"; 12 if (/(y+)/.test(fmt)) 13 fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length)); 14 for (var k in o) 15 if (new RegExp("(" + k + ")").test(fmt)) 16 fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length))); 17 return fmt; 18 }
關於echarts、layer.js和jqGrid的知識點