From 960724cde383aa22682fba342282465a382ad736 Mon Sep 17 00:00:00 2001 From: datagear Date: Wed, 7 Apr 2021 11:00:38 +0800 Subject: [PATCH] =?UTF-8?q?=E7=9C=8B=E6=9D=BFJS=E5=AF=B9=E8=B1=A1loadChart?= =?UTF-8?q?=E6=81=A2=E5=A4=8D=E4=B8=BA=E4=BB=85=E5=8F=AF=E5=8A=A0=E8=BD=BD?= =?UTF-8?q?=E5=8D=95=E4=B8=AA=E5=9B=BE=E8=A1=A8=EF=BC=8C=E4=BB=A5=E5=90=91?= =?UTF-8?q?=E5=89=8D=E5=85=BC=E5=AE=B9=EF=BC=8C=E6=96=B0=E5=A2=9EloadChart?= =?UTF-8?q?s=E5=87=BD=E6=95=B0=E7=94=A8=E4=BA=8E=E5=8A=A0=E8=BD=BD?= =?UTF-8?q?=E5=A4=9A=E4=B8=AA=E5=9B=BE=E8=A1=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../static/script/datagear-chartFactory.js | 6 +- .../script/datagear-dashboardFactory.js | 202 +++++++++++++----- 2 files changed, 157 insertions(+), 51 deletions(-) diff --git a/datagear-web/src/main/resources/org/datagear/web/static/script/datagear-chartFactory.js b/datagear-web/src/main/resources/org/datagear/web/static/script/datagear-chartFactory.js index 65f84ecb..f9631524 100644 --- a/datagear-web/src/main/resources/org/datagear/web/static/script/datagear-chartFactory.js +++ b/datagear-web/src/main/resources/org/datagear/web/static/script/datagear-chartFactory.js @@ -192,7 +192,7 @@ /**图表事件的图表类型：HTML*/ chartFactory.CHART_EVENT_CHART_TYPE_HTML = "html"; - /**用于标识已完成渲染图表元素的属性名*/ + /**用于标识已渲染为图表的HTML元素的属性名*/ chartFactory.CHART_RENDERED_ATTR_NAME = "_dg_chart_rendered"; //---------------------------------------- @@ -437,7 +437,7 @@ return ($(element).attr(chartFactory.CHART_RENDERED_ATTR_NAME) == "true"); }; - //@deprecated 兼容2.3.0版本，将在未来版本移除，已被chartFactory.isRendered取代 + //@deprecated 兼容2.3.0版本的API，将在未来版本移除，已被chartFactory.isRendered取代 /** * 判断指定HTML元素是否是已渲染为图表。 * @@ -447,7 +447,7 @@ { return this.isRendered(element); }; - //@deprecated 兼容2.3.0版本，将在未来版本移除，已被chartFactory.isRendered取代 + //@deprecated 兼容2.3.0版本的API，将在未来版本移除，已被chartFactory.isRendered取代 /** * 初始化图表。 diff --git a/datagear-web/src/main/resources/org/datagear/web/static/script/datagear-dashboardFactory.js b/datagear-web/src/main/resources/org/datagear/web/static/script/datagear-dashboardFactory.js index a35fb812..e6e08204 100644 --- a/datagear-web/src/main/resources/org/datagear/web/static/script/datagear-dashboardFactory.js +++ b/datagear-web/src/main/resources/org/datagear/web/static/script/datagear-dashboardFactory.js @@ -859,7 +859,7 @@ }; /** - * 判断指定图表是否是已完成渲染。 + * 判断指定图表是否是已渲染。 * * @param chartInfo 图表标识信息：图表Jquery对象、图表HTML元素、图表HTML元素ID、图表对象、图表ID */ @@ -1467,30 +1467,111 @@ }; /** - * 异步加载图表。 - * 如果指定的HTML元素已经被渲染为图表，则已加载的图表不会被加入看板对象，也不会执行渲染和更新数据操作。 + * 异步加载单个图表，并将其加入此看板。 + * 如果指定的HTML元素已经被渲染为图表，则已加载的图表不会被加入看板，也不会执行渲染和更新数据操作。 * - * @param element 用于渲染图表的HTML元素、HTML元素数组、Jquery对象 - * @param chartWidgetId 选填参数，要加载的图表部件ID、图表部件ID数组，如果不设置，将从元素的"dg-chart-widget"属性取 - * @param ajaxOptions 选填参数，参数格式可以是ajax配置项：{...}、也可以是图表加载成功回调函数：function(chart){ ... }。 - * 如果ajax配置项的success函数、图表加载成功回调函数返回false，则后续不会自动调用dashboardBase.addChart函数。 + * @param element 用于渲染图表的HTML元素、Jquery对象 + * @param chartWidgetId 选填参数，要加载的图表部件ID，如果不设置，将从元素的"dg-chart-widget"属性取 + * @param ajaxOptions 选填参数，参数格式可以是图表加载成功回调函数：function(chart){ ... }，也可以是ajax配置项：{...}。 + * 如果图表加载成功回调函数、ajax配置项的success函数返回false，则这个图表不会加入此看板。 */ dashboardBase.loadChart = function(element, chartWidgetId, ajaxOptions) { + if(typeof(chartWidgetId) != "string") + { + ajaxOptions = chartWidgetId; + chartWidgetId = null; + } + element = $(element); - //整理参数 + if(!chartWidgetId) + chartWidgetId = element.attr(chartFactory.elementAttrConst.WIDGET); + + if(!chartWidgetId) + throw new Error("[chartWidgetId] argument or ["+chartFactory.elementAttrConst.WIDGET + +"] attribute must be set for HTML element"); + + if(!ajaxOptions) + ajaxOptions = {}; + else if($.isFunction(ajaxOptions)) + { + var successHandler = ajaxOptions; + ajaxOptions = + { + success: successHandler + }; + } + + var chartElementId = element.attr("id"); + if(!chartElementId) + { + chartElementId = chartFactory.nextElementId(); + element.attr("id", chartElementId); + } + + var chartRendered = this.isRendered(element); + + var _this = this; + + var myAjaxOptions = $.extend({}, ajaxOptions); + var successHandler = myAjaxOptions.success; + myAjaxOptions.success = function(chart, textStatus, jqXHR) + { + _this._initLoadedChart(chart, chartElementId); + + var re = true; + + if(successHandler) + re = successHandler.call(this, chart, textStatus, jqXHR); + + if(re != false) + { + if(!chartRendered) + _this.addChart(chart); + } + }; + + this._loadChartJson(chartWidgetId, myAjaxOptions); + }; + + /** + * 异步加载多个图表，并将它们加入此看板。 + * 如果指定的HTML元素已经被渲染为图表，则已加载的图表不会被加入看板，也不会执行渲染和更新数据操作。 + * + * @param element 用于渲染图表的HTML元素、HTML元素数组、Jquery对象 + * @param chartWidgetId 选填参数，要加载的图表部件ID、图表部件ID数组，如果不设置，将从元素的"dg-chart-widget"属性取 + * @param ajaxOptions 选填参数，参数格式可以是图表数组加载成功回调函数：function(charts){ ... }，也可以是ajax配置项：{...}。 + * 如果图表数组加载成功回调函数、ajax配置项的success函数返回false，则这些图表不会加入此看板。 + */ + dashboardBase.loadCharts = function(element, chartWidgetId, ajaxOptions) + { if(typeof(chartWidgetId) != "string" && !$.isArray(chartWidgetId)) { ajaxOptions = chartWidgetId; chartWidgetId = null; } + element = $(element); + if(chartWidgetId == null) chartWidgetId = []; else if(typeof(chartWidgetId) == "string") chartWidgetId = [ chartWidgetId ]; + if(!ajaxOptions) + ajaxOptions = {}; + else if($.isFunction(ajaxOptions)) + { + var successHandler = ajaxOptions; + ajaxOptions = + { + success: successHandler + }; + } + + var _this = this; + var chartWidgetIds = []; var chartElementIds = []; var chartRendereds = []; @@ -1516,18 +1597,68 @@ chartWidgetIds.push(widgetId); chartElementIds.push(elementId); - chartRendereds.push(chartFactory.isRendered($thisEle)); + chartRendereds.push(_this.isRendered($thisEle)); }); - var webContext = chartFactory.renderContextAttrWebContext(this.renderContext); - var url = chartFactory.toWebContextPathURL(webContext, webContext.attributes.loadChartURL); - var loadChartConfig = dashboardFactory.loadChartConfig; + var myAjaxOptions = $.extend({}, ajaxOptions); + var successHandler = myAjaxOptions.success; + myAjaxOptions.success = function(charts, textStatus, jqXHR) + { + for(var i=0; i 0 ? charts[0] : null) : charts); + successHandler.call(this, handlerChart, textStatus, jqXHR); } }; $.ajax(myAjaxOptions); }; - /** - * 初始化异步加载的图表。 - * - * @param chart 图表JSON对象 - * @param elementId 图表HTML元素ID - */ - dashboardBase._initLoadedChart = function(chart, elementId) - { - chart.elementId = elementId; - chart.plugin = chartFactory.chartPluginManager.get(chart.plugin.id); - this._initChart(chart); - }; - /** * 批量设置图表数据集参数值。 *