表格数据的显示方法、装置、电子设备及可读存储介质与流程

1.本公开涉及数据处理
技术领域：
：，特别涉及一种表格数据的显示方法、装置、电子设备及可读存储介质。
背景技术：
：：2.为了满足用户阅读大量数据的需求，常常会用到表格进行展示。在目前的技术方案中，表格的列宽度通常都是固定设置的，无法与实际所需显示的数据相适配，可能因为固定格式的单元格的宽度过小导致数据显示不全，或者因为单元格的宽度过大而浪费显示空间等。因此，如何提高表格与实际数据之间的适配度，进而保证数据的显示效果成为了亟待解决的技术问题。技术实现要素：3.本公开提供了一种表格数据的显示方法、装置、电子设备及可读存储介质，用于提高表格与实际数据之间的适配度，保证数据的显示效果。4.第一方面，本公开提供了一种表格数据的显示方法，包括以下步骤：5.响应于监听到的浏览器缩放事件，确定浏览器缩放比例；6.获取目标表格中的表格列的初始列宽度，根据所述浏览器缩放比例对所述初始列宽度进行调整，得到缩放列宽度；7.根据所述缩放列宽度，对所述表格列中包含的数据内容进行显示。8.第二方面，本公开提供了一种表格数据的显示装置，包括：9.监听模块，适于响应于监听到的浏览器缩放事件，确定浏览器缩放比例；10.调整模块，适于获取目标表格中的表格列的初始列宽度，根据所述浏览器缩放比例对所述初始列宽度进行调整，得到缩放列宽度；11.显示模块，适于根据所述缩放列宽度，对所述表格列中包含的数据内容进行显示。12.第三方面，本公开提供了一种电子设备，该电子设备包括：至少一个处理器；以及与所述至少一个处理器通信连接的存储器；其中，所述存储器存储有可被所述至少一个处理器执行的一个或多个计算机程序，一个或多个所述计算机程序被所述至少一个处理器执行，以使所述至少一个处理器能够执行上述方法。13.第四方面，本公开提供了一种计算机可读存储介质，其上存储有计算机程序，其中，所述计算机程序在被处理器/处理核执行时实现上述方法。14.本公开所提供的实施例，在监听到浏览器缩放事件的情况下，确定浏览器缩放比例，并获取目标表格中的表格列的初始列宽度，根据浏览器缩放比例对初始列宽度进行调整，得到缩放列宽度，从而根据缩放列宽度对表格列中包含的数据内容进行显示。由此可见，该方式通过监听浏览器缩放事件，并根据浏览器缩放比例对表格的初始列宽度进行动态调整的方式，能够有效解决固定格式的单元格的宽度过小导致数据显示不全、或者因为单元格的宽度过大而浪费显示空间等技术问题。该方式能够更好的提高表格与实际数据之间的适配度，进而保证了数据的显示效果。15.应当理解，本部分所描述的内容并非旨在标识本公开的实施例的关键或重要特征，也不用于限制本公开的范围。本公开的其它特征将通过以下的说明书而变得容易理解。附图说明16.附图用来提供对本公开的进一步理解，并且构成说明书的一部分，与本公开的实施例一起用于解释本公开，并不构成对本公开的限制。通过参考附图对详细示例实施例进行描述，以上和其他特征和优点对本领域技术人员将变得更加显而易见，在附图中：17.图1为本公开一个实施例提供的一种表格数据的显示方法的流程图；18.图2为本公开一个具体示例提供的一种表格数据的显示方法的流程图；19.图3为本公开实施例提供的一种表格数据的显示装置的框图；20.图4为本公开实施例提供的一种电子设备的框图。具体实施方式21.为使本领域的技术人员更好地理解本公开的技术方案，以下结合附图对本公开的示范性实施例做出说明，其中包括本公开实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本公开的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。22.在不冲突的情况下，本公开各实施例及实施例中的各特征可相互组合。23.如本文所使用的，术语“和/或”包括一个或多个相关列举条目的任何和所有组合。24.本文所使用的术语仅用于描述特定实施例，且不意欲限制本公开。如本文所使用的，单数形式“一个”和“该”也意欲包括复数形式，除非上下文另外清楚指出。还将理解的是，当本说明书中使用术语“包括”和/或“由……制成”时，指定存在所述特征、整体、步骤、操作、元件和/或组件，但不排除存在或添加一个或多个其它特征、整体、步骤、操作、元件、组件和/或其群组。“连接”或者“相连”等类似的词语并非限定于物理的或者机械的连接，而是可以包括电性的连接，不管是直接的还是间接的。25.除非另外限定，否则本文所用的所有术语(包括技术和科学术语)的含义与本领域普通技术人员通常理解的含义相同。还将理解，诸如那些在常用字典中限定的那些术语应当被解释为具有与其在相关技术以及本公开的背景下的含义一致的含义，且将不解释为具有理想化或过度形式上的含义，除非本文明确如此限定。26.根据本公开实施例的表格数据的显示方法可以由终端设备或服务器等电子设备执行，终端设备可以为车载设备、用户设备(userequipment，ue)、移动设备、用户终端、终端、蜂窝电话、无绳电话、个人数字助理(personaldigitalassistant，pda)、手持设备、计算设备、车载设备、可穿戴设备等；所述服务器可以是独立的物理服务器，也可以是多个物理服务器构成的服务器集群或者分布式系统，还可以是提供云计算服务的云服务器。所述方法具体可以是通过处理器调用存储器中存储的计算机程序的方式来实现。27.在相关技术中，表格的列宽度通常都是固定设置的，无法与实际所需显示的数据相适配，可能因为固定格式的单元格的宽度过小导致数据显示不全，或者因为单元格的宽度过大而浪费显示空间等。因此，如何提高表格与实际数据之间的适配度，进而保证数据的显示效果成为了亟待解决的技术问题。为了解决上述问题，本技术提出了一种表格数据的显示方法，在该方法中，通过监听浏览器缩放事件，并根据浏览器缩放比例对表格的初始列宽度进行动态调整的方式，能够有效解决固定格式的单元格的宽度过小导致数据显示不全、或者因为单元格的宽度过大而浪费显示空间等技术问题。该方式能够更好的提高表格与实际数据之间的适配度，进而保证了数据的显示效果。28.图1为本公开的一个实施例提供的一种表格数据的显示方法的流程图。参照图1，该方法包括：29.步骤s110：响应于监听到的浏览器缩放事件，确定浏览器缩放比例。30.其中，本实施例中的表格数据通过浏览器进行显示。相应的，需要持续监听浏览器缩放事件。具体的，可通过设置回调函数的方式进行监听，一旦监听到浏览器缩放事件，则通过回调函数返回事件参数，以便根据事件参数确定浏览器缩放比例。其中，事件参数用于表征浏览器缩放后的缩放尺度，例如，事件参数可用于表征浏览器缩放后的字符显示宽度、浏览器的长宽高等数据。另外，若未监听到浏览器缩放事件，则默认将浏览器缩放比例设置为1。31.在一种可选的实现方式中，响应于监听到的浏览器缩放事件，获取缩放后的浏览器的字符显示宽度；计算缩放后的浏览器的字符显示宽度与预设的标准字符宽度之间的比值，根据比值确定浏览器缩放比例。其中，缩放后的浏览器的字符显示宽度是指：在缩放后的浏览器中，每个字符的平均显示宽度。预设的标准字符宽度是指：在浏览器缩放比例为1的情况下，每个字符的平均显示宽度。相应的，通过计算缩放后的浏览器的字符显示宽度与预设的标准字符宽度之间的比值即可确定浏览器缩放比例。例如，在一个示例中，定义中文字符的宽度为14px(即14像素)，定义英文或其他字符的宽度为8px(即8像素)。相应的，全局监听浏览器缩放事件resize，通过浏览器缩放后获取到的缩放后的实际字体大小(即缩放后的浏览器的字符显示宽度)除以上述定义的字符大小即可得到缩放比例。32.步骤s120：获取目标表格中的表格列的初始列宽度，根据浏览器缩放比例对初始列宽度进行调整，得到缩放列宽度。33.其中，目标表格为待显示的表格。目标表格中包含至少两个表格列，每个表格列具有一个表头，用于表征该表格列中存储的数据的属性。例如，表格列的表头信息可以为“姓名”、“年龄”等。具体实施时，可以根据每个表格列中存储的数据的长度、类型等信息确定表格列的初始列宽度。然后，根据浏览器缩放比例对初始列宽度进行调整，得到缩放列宽度。例如，可以将浏览器缩放比例与初始列宽度之间的乘积作为缩放列宽度。34.步骤s130：根据缩放列宽度，对表格列中包含的数据内容进行显示。35.针对每个表格列，根据该表格列对应的缩放列宽度显示该表格列中的内容，从而确保每个表格列的实际显示宽度(即缩放列宽度)能够随浏览器的缩放比例而动态调整。36.由此可见，本公开所提供的实施例，在监听到浏览器缩放事件的情况下，确定浏览器缩放比例，并获取目标表格中的表格列的初始列宽度，根据浏览器缩放比例对初始列宽度进行调整，得到缩放列宽度，从而根据缩放列宽度对表格列中包含的数据内容进行显示。由此可见，该方式通过监听浏览器缩放事件，并根据浏览器缩放比例对表格的初始列宽度进行动态调整的方式，能够有效解决固定格式的单元格的宽度过小导致数据显示不全、或者因为单元格的宽度过大而浪费显示空间等技术问题。该方式能够更好的提高表格与实际数据之间的适配度，进而保证了数据的显示效果。37.在一种可选的实现方式中，为了避免因某个表格列的列宽度过长而导致用户不得不持续拖动滚动条方可查看表格的问题，预先设置预设宽度阈值，以限制表格列的最大列宽度，提升用户查阅表格的便捷性。相应的，在设置有预设宽度阈值的情况下，通过以下方式获取目标表格中的表格列的初始列宽度：38.首先，根据目标表格中的表格列的数据内容，确定表格列的候选列宽度。其中，表格列的候选列宽度是根据各个表格列的数据内容的长度和类型设定的，旨在适应表格列的内容。39.然后，在候选列宽度不大于预设宽度阈值的情况下，表格列的初始列宽度根据表格列的候选列宽度确定；在候选列宽度大于预设宽度阈值的情况下，表格列的初始列宽度根据预设宽度阈值确定。例如，若候选列宽度不大于预设宽度阈值，则表格列的初始列宽度直接设置为表格列的候选列宽度即可；又如，若候选列宽度大于预设宽度阈值，则表格列的初始列宽度可以直接设置为预设宽度阈值。40.通过上述方式能够有效避免因某个表格列中的内容过长而导致表格宽度过宽，需要用户持续拖动滚动条才能查阅的弊端。41.可选的，通过以下方式确定表格列的候选列宽度：42.首先，获取目标表格的表头配置信息。其中，表头配置信息用于存储表格中的各个表格列对应的表头的名称、字符数量、字符宽度等数据。由此可见，表头配置信息用于存储与每个表格列中的表头相关的属性信息，如表格列中表头包含的字符种类、字符内容、字符排布方式等。43.一方面，根据表头配置信息确定表格列中表头信息的表头字符宽度，根据表头信息的表头字符宽度确定表头列宽度。具体的，根据表头配置信息确定表格列中表头信息所对应的字符类型以及字符数量；根据表格列中表头信息所对应的字符类型以及字符数量，确定表格列中表头信息的表头字符宽度，根据表头字符宽度确定表头列宽度。例如，表头信息的表头字符宽度通过以下方式计算：获取表头信息中包含的各个字符，分别计算每个字符的字符宽度，将表头信息中包含的各个字符的字符宽度累加，得到表头信息的表头字符宽度。表头列宽度可以等于表头字符宽度或略大于表头字符宽度。通过上述方式，即可确定出每个表格列对应的表头的表头列宽度。例如，若第一表格列对应的表头为“姓名”，第二表格列对应的表头为“出生日期”，则第二表格列的表头列宽度大于第一表格列的表头列宽度。44.另一方面，获取表格列中内容信息的内容字符宽度，根据内容信息的内容字符宽度确定内容列宽度。由于每个表格列除表头之外，其余的行用于存储具体的内容信息，因此，为了准确确定该表格列的宽度，还需要根据表格列中内容信息的内容字符宽度确定内容列宽度。例如，通过数据获取接口获取表格列对应的每一行的行数据内容；针对每一行，根据该行的行数据内容中包含的字符数量，计算该行的行内容宽度；将行内容宽度的最大值确定为内容列宽度。举例而言，假设在“姓名”这一表格列中，部分数据行中的内容为两个字符(由两个汉字构成的姓名)，部分数据行中的内容为三个字符(由三个汉字构成的姓名)，部分数据行中的内容为四个字符(由四个汉字构成的姓名)，则需要根据四个字符计算的行内容宽度来确定内容列宽度。通过上述方式，即可确定出每个表格列对应的内容列宽度。45.最后，将表头列宽度以及内容列宽度中的最大值确定为表格列的候选列宽度。由于同一个表格列中的表头和内容的宽度应设置为相等，因此，可以将表头列宽度以及内容列宽度中的最大值确定为表格列的候选列宽度，以使该表格列中的表头以及各行内容的宽度均为对应的候选列宽度。46.在又一种可选的实现方式中，通过以下方式对表格列中包含的数据内容进行显示：逐行显示表格列对应的每一行的行数据内容。具体的，通过数据获取接口逐行获取表格列对应的每一行的行数据内容并进行显示。其中，在设置有预设宽度阈值的情况下，为了方便展示，将行内容宽度大于预设宽度阈值的行作为动态显示行，动态显示行的行数据内容包括：第一局部内容以及第二局部内容。其中，第一局部内容为默认显示的与预设宽度阈值相匹配的内容，第一局部内容中包含的字符的数量和内容取决于预设宽度阈值的具体数值。第二局部内容是响应于接收到的全局显示指令动态显示的内容。由此可见，动态显示行的行数据内容除包括与预设宽度阈值相匹配的第一局部内容之外，还包括除第一局部内容之外的第二局部内容。其中，全局显示指令由用户在需要时主动触发，因此，第二局部内容在默认状态下不显示，仅在接收到全局显示指令后动态显示。相应的，动态显示行通过以下方式显示：默认显示第一局部内容，并且，在接收到全局显示指令的情况下，显示第二局部内容。例如，针对行内容宽度大于预设宽度阈值的动态显示行，根据该行的列宽度确定第一局部内容的数量，然后，将剩余的内容均作为第二局部内容。当用户将鼠标放置在该动态显示行上，或用户点击该动态显示行时，进一步显示出第二局部内容。由此可见，全局显示指令可通过鼠标滑动、鼠标点击等各类方式触发。47.在又一种可选的实现方式中，为了加快各个表格列的表头的渲染速度，避免长时间白屏的问题，将表头信息和内容信息采用分步渲染的方式进行渲染：48.首先，在根据表头信息的字符宽度确定表头列宽度之后，进一步根据表头列宽度执行表头渲染操作，以显示表格列的表头信息。由此可见，在确定出表头列宽度之后，无需等待后续步骤完成，即先行根据表头列宽度执行表头渲染操作，以显示表格列的表头信息。由此能够避免整个表格长时间处于白屏状态，使用户能够快速查看各个表格列的表头信息。49.然后，在根据缩放列宽度，对表格列中包含的数据内容进行显示时，根据缩放列宽度执行内容渲染操作，以显示表格列的内容信息；并且，若表头列宽度与缩放列宽度不同，则进一步根据缩放列宽度对表头列宽度进行调整后重新执行表头渲染操作。由此可见，在该步骤中，若表头列宽度与缩放列宽度相同，则无需再对已经渲染的表头信息进行二次渲染；若表头列宽度与缩放列宽度不同，则需要根据缩放列宽度对表头列宽度进行调整后重新执行表头渲染操作。50.通过分步渲染的方式能够优化显示速度，解决因长时间白屏所导致的用户体验较差的问题。51.为了便于理解，下面以一个具体示例为例，详细介绍本技术中的表格数据的显示方法的具体实现细节：52.目前，互联网中开发管理平台之类的系统时最常见的布局就是表单和表格。因此，表格的功能完善成为系统开发中的重要任务。53.在一些相关技术中，表格通过手动设置列的宽度属性来决定列宽。表格宽度会根据开发者手动设置的列宽不断撑开。并且，在表格内容过长时会产生滚动条。但是，该方式至少存在以下问题：开发人员手动设置列宽，会导致某些列宽度设置较小，而内容多时无法显示完整内容，或者内容少时列宽设置过大存在大片空白。这样一来，开发过程中就需要手动去调整列宽，从而增加开发任务而且无法达到自动适应内容的效果。并且，对于很多浏览器而言，浏览器中展示的表格字体大小、间距等信息无法随浏览器缩放而等比例缩放，进而导致布局显示混乱。54.为了解决上述问题，在本示例中，引入了表格组件，可通过表格组件设置列的width属性，根据width属性决定对应的表格列的宽度。由于前端开发中用于确定表格布局的table标签需要由开发者再次进行组件封装才能功能全面的满足应用需求，且目前前端技术中使用较多的表格组件是element.js中的表格组件，因此，本示例基于element中的表格组件进行再次封装实现。该示例能够将手动设置表格宽度的方式改进为：根据数据内容自动计算表格宽度的方式，从而能够自动设置表格宽度，进而避免手动设置宽度的繁杂以及宽度不能自动适应内容的问题。另外，该示例至少能够实现如下功能点：55.1、表格的宽度由表格内容自动确定，而无需通过开发者手动设置宽度。56.2、在不同浏览器分辨率、不同浏览器缩放比例的情况下，表格内容自动根据浏览器的缩放情况进行动态计算，以达到自适应表格内容的展示效果。57.3、表格内容自适应展示后，单元格内容可通过多种展示形式进行显示，每种展示形式可以满足不同需求情况下对表格展示的需求。具体的，单元格内容的展示形式包括：58.(1)表格内容按照数据内容自动撑开，该情况适用于表格内容需要完全展示给用户的情况，当一行中的数据过长时会产生滚动条。59.(2)表格内容根据设置的表格列最大宽度阈值自动截取，内容超长的自动省略，当鼠标移动到单元格时显示完整信息。该展示形式可以把不重要的信息自动省略，达到不需要拖动滚动条就能看见表格内容的效果。60.根据以上几个功能点至少能够解决如下问题：61.1、根据第一个功能点可以解决开发者手动设置宽度所导致的增加开发任务、宽度无法根据内容决定，因而导致某些列过宽或者过窄的问题，并且，手动设置的宽度还可能导致界面显示混乱、不紧凑等问题。62.2、根据第二个功能点可以解决通过内容自动计算的宽度去设置表格宽度后，当用户缩放浏览器时内容宽度不会自动变化，从而导致内容显示错乱和字体大小不根据浏览器缩放比例自动适配的问题。63.3、根据第三个功能点可以解决表格只能根据内容自适应展示时所导致的以下问题：当表格内容过长时会产生表格滚动条，用户需要拖动滚动条才能显示完表格，导致表格重要字段不能直观给用户展示。通过设置超过长度省略(即预设宽度阈值)可以解决这一问题，将不重要的字段可以设置为超长自动省略，仅展示重要信息，提升用户体验度。64.图2示出了本示例的具体流程图。如图2所示，该示例具体通过以下方式实现：65.首先，在页面中引入表格组件，初始化组件；并设置中文字符的像素尺寸为14px，设置英文字符的像素尺寸为8px。另外，设置全局监听器resize监听浏览器缩放事件，得到浏览器缩放比例。66.另外，为了计算表格的列宽度，需要执行以下操作：67.首先，传入表格的表头配置对象。根据传入的表头配置对象，计算每一列的表头字符宽度，具体将表头内容中的每个字符的宽度相加即可得到表头字符宽度，将表头字符宽度存入对象变量widthobj中。根据上面计算出的表头字符宽度绘制表格的表头宽度，自动设置每列的宽度取值为widthobj对象中计算出的表头字符宽度。通过上述方式即可计算出一列中的表头的宽度。68.然后，还要计算一列中的内容的宽度。具体的，通过数据获取接口获取每一行的数据内容，在监听到表格数据已返回的情况下，循环计算每一行的内容宽度，提取该列的各行的内容宽度以及该列的表头宽度，并确定各行的内容宽度以及表头宽度中的最大值，根据得到的最大值更新上述的对象变量widthobj。69.另外，还要判断是否设置有表格最大宽度的阈值max(即预设宽度阈值)，在设置有阈值max的情况下，则进一步将上述的最大值与max做比较，如果最大值大于max值则将列宽(即对象变量widthobj的值)更新成max的值，如果最大值小于max的值则列宽为(即对象变量widthobj的值)仍然为上述的最大值。70.通过上述方式得到的列宽即为表格列的初始列宽度。将该初始列宽度乘以监听到的浏览器缩放比例，即可得出不同浏览器缩放比例下的列宽值(即缩放列宽度)，根据缩放列宽度自动设置列宽。重新绘制表格即可得到按照内容及缩放比例自适应显示的表格，超过表格宽度阈值max的内容会自动省略显示，并且在鼠标移动到相应位置的时候会显示完整内容。71.由此可见，该示例至少能够解决以下技术问题：72.(1)通过监听浏览器缩放比例然后重新计算表格宽度可以解决在浏览器缩放比例改变时页面显示错乱等问题。73.(2)通过设置表格宽度阀值，可以解决表格内容过长时，无限撑开表格导致表格产生较长滚动条，用户无法直观看到完整列表的问题。74.(3)通过给超过阈值的内容设置自动省略，鼠标移上去显示完整内容的操作可以实现用户无需拖动滚动条就能查看表格隐藏内容的效果。75.(4)通过设置阈值控制是否需要自动省略的显示，既保留了表格可以通过内容自动适应的显示方式，也可通过设置阈值自动省略部分内容，这两种方式可根据具体需求选择不同的方案，能够使得表格组件适合于更多的显示场景。76.总之，该示例通过表格宽度自适应能够节约开发成本，开发者不需再手动去设置列表来控制表格展示，界面不会因为手动设置宽度过大或者过小而导致界面显示不全或者空白过多。通过监听浏览器缩放来重新计算表格宽度可以达到在不同浏览器缩放比例下等比例显示界面，使得界面显示更加美观，不会导致内容显示错乱。通过给表格宽度设置阈值可以实现多种内容显示方式，使得能够满足更多的展示场景，使得场景展示多元化。不仅限于根据表格内容自动撑开表格，还能根据需求设置表格最大阀值使得超长省略，根据不同的展示方式满足不同的需求场景，使得表格组件更加丰富，开发人员不用手动去设置表格是否该省略显示，降低了开发成本，增加了多元的显示形式。77.可以理解，本公开提及的上述各个方法实施例，在不违背原理逻辑的情况下，均可以彼此相互结合形成结合后的实施例，限于篇幅，本公开不再赘述。本领域技术人员可以理解，在具体实施方式的上述方法中，各步骤的具体执行顺序应当以其功能和可能的内在逻辑确定。78.此外，本公开还提供了表格数据的显示装置、电子设备、计算机可读存储介质，上述均可用来实现本公开提供的任一种表格数据的显示方法，相应技术方案和描述和参见方法部分的相应记载，不再赘述。79.图3本公开实施例提供的一种表格数据的显示装置的框图。80.参照图3本公开实施例提供了一种表格数据的显示装置30，该表格数据的显示装置30包括：81.监听模块31，适于响应于监听到的浏览器缩放事件，确定浏览器缩放比例；82.调整模块32，适于获取目标表格中的表格列的初始列宽度，根据浏览器缩放比例对初始列宽度进行调整，得到缩放列宽度；83.显示模块33，适于根据缩放列宽度，对表格列中包含的数据内容进行显示。84.在一种可选的实现方式中，调整模块具体适于：85.根据目标表格中的表格列的数据内容，确定表格列的候选列宽度；86.在候选列宽度不大于预设宽度阈值的情况下，表格列的初始列宽度根据表格列的候选列宽度确定；87.在候选列宽度大于预设宽度阈值的情况下，表格列的初始列宽度根据预设宽度阈值确定。88.在一种可选的实现方式中，调整模块具体适于：89.获取目标表格的表头配置信息，根据表头配置信息确定表格列中表头信息所对应的字符类型以及字符数量；90.根据表格列中表头信息所对应的字符类型以及字符数量，确定表格列中表头信息的表头字符宽度，根据表头字符宽度确定表头列宽度；91.获取表格列中内容信息的内容字符宽度，根据内容信息的内容字符宽度确定内容列宽度；92.将表头列宽度以及内容列宽度中的最大值确定为表格列的候选列宽度。93.在一种可选的实现方式中，调整模块具体适于：94.通过数据获取接口获取表格列对应的每一行的行数据内容；95.针对每一行，根据该行的行数据内容中包含的字符数量，计算该行的行内容宽度；96.将行内容宽度的最大值确定为内容列宽度。97.在一种可选的实现方式中，显示模块具体适于：98.逐行显示表格列对应的每一行的行数据内容；99.其中，将行内容宽度大于预设宽度阈值的行作为动态显示行，动态显示行的行数据内容包括：第一局部内容以及第二局部内容；其中，第一局部内容为默认显示的与预设宽度阈值相匹配的内容，第二局部内容是响应于接收到的全局显示指令动态显示的内容。100.在一种可选的实现方式中，显示模块具体适于：在调整模块根据表头字符宽度确定表头列宽度之后，根据表头列宽度执行表头渲染操作，以显示表格列的表头信息；101.并且，根据缩放列宽度执行内容渲染操作，以显示表格列的内容信息；其中，若表头列宽度与缩放列宽度不同，根据缩放列宽度对表头列宽度进行调整后重新执行表头渲染操作。102.在一种可选的实现方式中，监听模块具体适于：103.响应于监听到的浏览器缩放事件，获取缩放后的浏览器的字符显示宽度；104.计算缩放后的浏览器的字符显示宽度与预设的标准字符宽度之间的比值，根据比值确定浏览器缩放比例。105.由此可见，本公开所提供的实施例，在监听到浏览器缩放事件的情况下，确定浏览器缩放比例，并获取目标表格中的表格列的初始列宽度，根据浏览器缩放比例对初始列宽度进行调整，得到缩放列宽度，从而根据缩放列宽度对表格列中包含的数据内容进行显示。由此可见，该方式通过监听浏览器缩放事件，并根据浏览器缩放比例对表格的初始列宽度进行动态调整的方式，能够有效解决固定格式的单元格的宽度过小导致数据显示不全、或者因为单元格的宽度过大而浪费显示空间等技术问题。该方式能够更好的提高表格与实际数据之间的适配度，进而保证了数据的显示效果。106.图4为本公开实施例提供的一种电子设备的框图。107.参照图4本公开实施例提供了一种电子设备，该电子设备包括：至少一个处理器501；至少一个存储器502，以及一个或多个i/o接口503，连接在处理器501与存储器502之间；其中，存储器502存储有可被至少一个处理器501执行的一个或多个计算机程序，一个或多个计算机程序被至少一个处理器501执行上述表格数据的显示方法。108.本公开实施例还提供了一种计算机可读存储介质，其上存储有计算机程序，其中，所述计算机程序在被处理器/处理核执行时实现上述的表格数据的显示方法。计算机可读存储介质可以是易失性或非易失性计算机可读存储介质。109.本公开实施例还提供了一种计算机程序产品，包括计算机可读代码，或者承载有计算机可读代码的非易失性计算机可读存储介质，当所述计算机可读代码在电子设备的处理器中运行时，所述电子设备中的处理器执行上述表格数据的显示方法。110.本领域普通技术人员可以理解，上文中所公开方法中的全部或某些步骤、系统、装置中的功能模块/单元可以被实施为软件、固件、硬件及其适当的组合。在硬件实施方式中，在以上描述中提及的功能模块/单元之间的划分不一定对应于物理组件的划分；例如，一个物理组件可以具有多个功能，或者一个功能或步骤可以由若干物理组件合作执行。某些物理组件或所有物理组件可以被实施为由处理器，如中央处理器、数字信号处理器或微处理器执行的软件，或者被实施为硬件，或者被实施为集成电路，如专用集成电路。这样的软件可以分布在计算机可读存储介质上，计算机可读存储介质可以包括计算机存储介质(或非暂时性介质)和通信介质(或暂时性介质)。111.如本领域普通技术人员公知的，术语计算机存储介质包括在用于存储信息(诸如计算机可读程序指令、数据结构、程序模块或其他数据)的任何方法或技术中实施的易失性和非易失性、可移除和不可移除介质。计算机存储介质包括但不限于随机存取存储器(ram)、只读存储器(rom)、可擦式可编程只读存储器(eprom)、静态随机存取存储器(sram)、闪存或其他存储器技术、便携式压缩盘只读存储器(cd-rom)、数字多功能盘(dvd)或其他光盘存储、磁盒、磁带、磁盘存储或其他磁存储装置、或者可以用于存储期望的信息并且可以被计算机访问的任何其他的介质。此外，本领域普通技术人员公知的是，通信介质通常包含计算机可读程序指令、数据结构、程序模块或者诸如载波或其他传输机制之类的调制数据信号中的其他数据，并且可包括任何信息递送介质。112.这里所描述的计算机可读程序指令可以从计算机可读存储介质下载到各个计算/处理设备，或者通过网络、例如因特网、局域网、广域网和/或无线网下载到外部计算机或外部存储设备。网络可以包括铜传输电缆、光纤传输、无线传输、路由器、防火墙、交换机、网关计算机和/或边缘服务器。每个计算/处理设备中的网络适配卡或者网络接口从网络接收计算机可读程序指令，并转发该计算机可读程序指令，以供存储在各个计算/处理设备中的计算机可读存储介质中。113.用于执行本公开操作的计算机程序指令可以是汇编指令、指令集架构(isa)指令、机器指令、机器相关指令、微代码、固件指令、状态设置数据、或者以一种或多种编程语言的任意组合编写的源代码或目标代码，所述编程语言包括面向对象的编程语言—诸如smalltalk、c++等，以及常规的过程式编程语言—诸如“c”语言或类似的编程语言。计算机可读程序指令可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络—包括局域网(lan)或广域网(wan)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。在一些实施例中，通过利用计算机可读程序指令的状态信息来个性化定制电子电路，例如可编程逻辑电路、现场可编程门阵列(fpga)或可编程逻辑阵列(pla)，该电子电路可以执行计算机可读程序指令，从而实现本公开的各个方面。114.这里所描述的计算机程序产品可以具体通过硬件、软件或其结合的方式实现。在一个可选实施例中，所述计算机程序产品具体体现为计算机存储介质，在另一个可选实施例中，计算机程序产品具体体现为软件产品，例如软件开发包(softwaredevelopmentkit，sdk)等等。115.这里参照根据本公开实施例的方法、装置(系统)和计算机程序产品的流程图和/或框图描述了本公开的各个方面。应当理解，流程图和/或框图的每个方框以及流程图和/或框图中各方框的组合，都可以由计算机可读程序指令实现。116.这些计算机可读程序指令可以提供给通用计算机、专用计算机或其它可编程数据处理装置的处理器，从而生产出一种机器，使得这些指令在通过计算机或其它可编程数据处理装置的处理器执行时，产生了实现流程图和/或框图中的一个或多个方框中规定的功能/动作的装置。也可以把这些计算机可读程序指令存储在计算机可读存储介质中，这些指令使得计算机、可编程数据处理装置和/或其他设备以特定方式工作，从而，存储有指令的计算机可读介质则包括一个制造品，其包括实现流程图和/或框图中的一个或多个方框中规定的功能/动作的各个方面的指令。117.也可以把计算机可读程序指令加载到计算机、其它可编程数据处理装置、或其它设备上，使得在计算机、其它可编程数据处理装置或其它设备上执行一系列操作步骤，以产生计算机实现的过程，从而使得在计算机、其它可编程数据处理装置、或其它设备上执行的指令实现流程图和/或框图中的一个或多个方框中规定的功能/动作。118.附图中的流程图和框图显示了根据本公开的多个实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段或指令的一部分，所述模块、程序段或指令的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个连续的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或动作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。119.本文已经公开了示例实施例，并且虽然采用了具体术语，但它们仅用于并仅应当被解释为一般说明性含义，并且不用于限制的目的。在一些实例中，对本领域技术人员显而易见的是，除非另外明确指出，否则可单独使用与特定实施例相结合描述的特征、特性和/或元素，或可与其他实施例相结合描述的特征、特性和/或元件组合使用。因此，本领域技术人员将理解，在不脱离由所附的权利要求阐明的本公开的范围的情况下，可进行各种形式和细节上的改变。当前第1页12当前第1页12
技术特征：
1.一种表格数据的显示方法，其特征在于，包括：响应于监听到的浏览器缩放事件，确定浏览器缩放比例；获取目标表格中的表格列的初始列宽度，根据所述浏览器缩放比例对所述初始列宽度进行调整，得到缩放列宽度；根据所述缩放列宽度，对所述表格列中包含的数据内容进行显示。2.根据权利要求1所述的方法，其特征在于，所述获取目标表格中的表格列的初始列宽度包括：根据所述目标表格中的表格列的数据内容，确定所述表格列的候选列宽度；在所述候选列宽度不大于预设宽度阈值的情况下，所述表格列的初始列宽度根据所述表格列的候选列宽度确定；在所述候选列宽度大于预设宽度阈值的情况下，所述表格列的初始列宽度根据所述预设宽度阈值确定。3.根据权利要求2所述的方法，其特征在于，所述根据所述目标表格中的表格列的数据内容，确定所述表格列的候选列宽度包括：获取目标表格的表头配置信息，根据所述表头配置信息确定所述表格列中表头信息所对应的字符类型以及字符数量；根据所述表格列中表头信息所对应的字符类型以及字符数量，确定所述表格列中表头信息的表头字符宽度，根据所述表头字符宽度确定表头列宽度；获取所述表格列中内容信息的内容字符宽度，根据所述内容信息的内容字符宽度确定内容列宽度；将所述表头列宽度以及所述内容列宽度中的最大值确定为所述表格列的候选列宽度。4.根据权利要求3所述的方法，其特征在于，所述获取所述表格列的内容信息的内容字符宽度，根据所述内容信息的内容字符宽度确定内容列宽度包括：通过数据获取接口获取所述表格列对应的每一行的行数据内容；针对每一行，根据该行的行数据内容中包含的字符数量，计算该行的行内容宽度；将行内容宽度的最大值确定为所述内容列宽度。5.根据权利要求4所述的方法，其特征在于，所述根据所述缩放列宽度，对所述表格列中包含的数据内容进行显示包括：逐行显示所述表格列对应的每一行的行数据内容；其中，将行内容宽度大于预设宽度阈值的行作为动态显示行，所述动态显示行的行数据内容包括：第一局部内容以及第二局部内容；其中，所述第一局部内容为默认显示的与所述预设宽度阈值相匹配的内容，所述第二局部内容是响应于接收到的全局显示指令动态显示的内容。6.根据权利要求3所述的方法，其特征在于，所述根据所述表头字符宽度确定表头列宽度之后，还包括：根据所述表头列宽度执行表头渲染操作，以显示所述表格列的表头信息；则所述根据所述缩放列宽度，对所述表格列中包含的数据内容进行显示包括：根据所述缩放列宽度执行内容渲染操作，以显示所述表格列的内容信息；其中，若所述表头列宽度与所述缩放列宽度不同，根据所述缩放列宽度对所述表头列宽度进行调整后重新执行表头渲染操作。
7.根据权利要求1-6任一所述的方法，其特征在于，所述响应于监听到的浏览器缩放事件，确定浏览器缩放比例包括：响应于监听到的浏览器缩放事件，获取缩放后的浏览器的字符显示宽度；计算所述缩放后的浏览器的字符显示宽度与预设的标准字符宽度之间的比值，根据所述比值确定浏览器缩放比例。8.一种表格数据的显示装置，其特征在于，包括：监听模块，适于响应于监听到的浏览器缩放事件，确定浏览器缩放比例；调整模块，适于获取目标表格中的表格列的初始列宽度，根据所述浏览器缩放比例对所述初始列宽度进行调整，得到缩放列宽度；显示模块，适于根据所述缩放列宽度，对所述表格列中包含的数据内容进行显示。9.一种电子设备，其特征在于，包括：至少一个处理器；以及与所述至少一个处理器通信连接的存储器；其中，所述存储器存储有可被所述至少一个处理器执行的一个或多个计算机程序，一个或多个所述计算机程序被所述至少一个处理器执行，以使所述至少一个处理器能够执行如权利要求1-7中任一项所述的方法。10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序在被处理器执行时实现如权利要求1-7中任一项所述的方法。

技术总结
本公开提供了一种表格数据的显示方法、装置、电子设备及可读存储介质，用于提高表格与实际数据之间的适配度，保证数据的显示效果。该方法包括：响应于监听到的浏览器缩放事件，确定浏览器缩放比例；获取目标表格中的表格列的初始列宽度，根据浏览器缩放比例对初始列宽度进行调整，得到缩放列宽度；根据缩放列宽度，对表格列中包含的数据内容进行显示。该方式能够更好的提高表格与实际数据之间的适配度，进而保证了数据的显示效果。而保证了数据的显示效果。而保证了数据的显示效果。


技术研发人员：吴永琼 孔珣 郭江
受保护的技术使用者：马上消费金融股份有限公司
技术研发日：2023.03.03
技术公布日：2023/8/1