CN107562450A - 一种地方志资源跨平台可视化方法 - Google Patents
一种地方志资源跨平台可视化方法 Download PDFInfo
- Publication number
- CN107562450A CN107562450A CN201710607058.6A CN201710607058A CN107562450A CN 107562450 A CN107562450 A CN 107562450A CN 201710607058 A CN201710607058 A CN 201710607058A CN 107562450 A CN107562450 A CN 107562450A
- Authority
- CN
- China
- Prior art keywords
- resource
- design
- local
- module
- local chronicle
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Landscapes
- User Interface Of Digital Computer (AREA)
Abstract
本发明属于地方志数字化资源技术领域，提供一种地方志资源跨平台可视化方法，包括(1)对传统的地方志资源进行收集、整理、组织；(2)将所需的传统的地方志资源进行数字化；(3)对处理好的数据资源的呈现进行设计：信息模块设计、布局模块设计、交互模块设计；(4)根据相应模块，选取相应的技术，对pc端和移动端分别进行设置，对各模块进行技术实现；(5)将实现三种模块时所生成的代码进行整合。本发明方法将传统的地方志资源转化为能够自适应地在pc端和移动端显示、并且具有良好的交互性的地方志数字资源，使用户可以得到一致的、完整的、可用的交互体验，更利于地方志资源的推广。
Description
技术领域
本发明属于地方志数字化资源技术领域，具体地说涉及一种地方志资源跨平台可视化方法。
背景技术
地方志是我国特有的一种具有较高史料价值的地方文献，为了保护地方志，推广地方志文化，随着我国信息化、现代化水平不断提升，我国于2003年提出对地方志资源进行数字化建设。
经过十几年的数字方志资源建设，在目前的地方志数字资源库中，现有的能够实现跨平台的地方志数字资源大多是通过对原始文献进行扫描，转换为PDF格式，将纸质的方志书籍完全照搬转化为电子格式的书，以文本或图片的静态方式呈现，存在用户界面单调、缺乏交互性的问题，难以吸引读者，不易于地方志文化的推广等问题。而目前具有交互性的地方志数字资源都是采用flash技术实现，不具备跨平台的特性，同时也存在加载、响应慢，文字不能即时复制、不支持文本内容检索等问题。
目前在地方志数字化资源领域，还没有一种地方志数字化资源能够同时具有跨平台性和交互性。基于此，如何在还原方志内容真实性的情况下增强地方志电子书的交互性，内容呈现形式的丰富性，使地方志电子书动态化、交互化，并具有跨终端、跨平台的功能，增加地方志数字资源的可读性，提高读者的用户体验，从而达到推广地方志的目的，正是亟待解决的问题。
发明内容
本发明的目的在于克服上述现有技术中的不足，提供一种地方志资源跨平台可视化方法，将传统的地方志资源转化为能够自适应地在pc端和移动端显示、并且具有良好的交互性的地方志数字资源，使用户可以得到一致的、完整的、可用的交互体验，更利于地方志资源的推广。
本发明目的是通过如下技术方案实现的。
一种地方志资源跨平台可视化方法，包括以下步骤：
(1)对传统的地方志资源进行收集、整理、组织，收集各类相关的方志文献、图片、视频，将这些内容整理组织成***的章节；
(2)将所需的传统的地方志资源进行数字化，通过扫描或其他文字、图像识别方式处理成相应的可用的数据资源；
(3)对处理好的数据资源的呈现进行设计，具体涉及三个模块的设计：信息模块设计、布局模块设计、交互模块设计；
(4)根据相应模块，选取相应的技术，对pc端和移动端分别进行设置，对各模块进行技术实现；具体包括：信息模块实现、布局模块实现、交互模块实现；
(5)将实现三种模块时所生成的代码进行整合，将布局模块实现时生成的代码和交互模块实现时生成的代码链入信息模块实现时生成的代码中。
在上述技术方案中，所述信息模块设计用于对页面所要显示的内容信息进行设计，包括方志目录导航、内容信息呈现形式设计，所述方志目录导航模拟纸质书的目录的形式将各章节的主题内容和页码清晰的展示出来，地方志的内容信息比较多样化，涵盖范围比较广，在对内容信息呈现形式设计时要根据所呈现的具体信息内容特点按照人们最能直观理解的方式和思维习惯进行设计，呈现的方式可以包括文字、图片、动画、视频等多媒体形式。
在上述技术方案中，所述布局模块设计用于对各个终端平台的页面的布局及样式分别进行设计，包括设计符合地方志特色的背景图、各信息模块排版的设计、以及根据具体方志信息的内容对显示的样式进行优化，使得整个页面符合与地方志的主题相符，且看起来内容清晰，界面样式合理、美观。
在上述技术方案中，所述交互模块设计用于对用户与页面的交互形式进行设计，即用户触发一个动作事件，页面做出相应的响应；包括目录导航交互的设计；对手写旧志中批注、删改的内容进行交互的设计；将地方志内容中较多生僻的需要注释的内容进行交互的设计；对页面的切换及其他特定的需要交互的元素进行交互的设计。在这个模块可以适当设计多种形式的页面交互，以增加页面和用户之间的互动。不同终端人机交互的方式不同，pc端包括鼠标事件和键盘事件，移动端使用触摸事件。
在上述技术方案中，信息模块的实现首先是将信息模块设计的具体内容信息呈现形式制作出来，根据所设计的呈现形式利用对应的软件进行制作，然后利用html5语言根据信息模块的设计对所要呈现的数据资源进行编写，为了使页面在移动端能够更加适合屏幕显示，需要在html头文件中增加对页面视区的设置，使得页面视区与设备宽度相等，并禁止缩放，使得页面在移动端能够适应设备大小更好的显示。
在上述技术方案中，布局模块的实现是利用响应式布局编写层叠样式表，根据查询媒体设备屏幕大小的方式设定对应设备的显示样式，使浏览器依据具体设备进行选择性的样式呈现，使用户在每个不同的设备上都能看到内容一致，且界面布局显示最合适的页面。
在上述技术方案中，交互模块的实现是应用JavaScript脚本语言对交互模块设计的pc端和移动端的交互事件同时进行编写，使得在两种终端都能实现，保证跨平台的同时也体现交互性。在pc端使用JavaScript中原有的click、onmouseover、onmouseout对鼠标点击、鼠标上划、鼠标移出进行事件设置；在移动端提供一种自定义的tap点击事件的方法：封装一个tap函数，通过判断执行touchstart和touchend时的位移差是否小于一个位移值来判断是否执行点击事件。
与现有技术相比，本发明的有益效果在于：
1、与传统的将原始文献通过扫描生成数字图像资源的方式相比，利用本发明方法使得地方志数字化资源更加具有交互性、动态性。
2、与flash实现技术相比，利用本发明方法使地方志数字化资源具有跨平台性，能够减少代码开发成本，并且加载、响应速度较快，并且能够保持文本资源的文本数据特性。
附图说明
图1为本发明方法的流程图。
图2为本发明方法中信息模块的实现流程图。
图3为本发明方法中布局模块的实现流程图。
图4为本发明方法中交互模块的实现流程图。
具体实施方式
为了使本发明的目的、技术方案及优点更加清楚明白，下面结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅用以解释本发明，并不用于限定本发明。
如果要实现地方志数据资源能够跨平台显示，且在各平台上都能与用户进行交互，那就需要一种适用于各终端、各操作***的开发语言。本发明所选取的是网页编程语言，可以在各平台的浏览器中运行。目前html5,css3标准提供了选择查询以及适配终端的规则，使得各平台可以根据自身的属性选择适应的方法。同时JavaScript也分别支持监听pc端和移动端的事件，使得交互在各平台上都能够实现。本发明一种地方志数据跨平台交互式可视化方法正是基于这些技术及标准所提出的。
如图1所示，本发明实施例提供一种地方志资源跨平台可视化方法，包括以下步骤：
(1)对传统的地方志资源进行收集、整理、组织；
地方志记载的内容包括一个地方的自然、人文、经济等各方面，相当于一个地方的百科全书。所以需要收集各类相关的方志文献、图片、视频等，然后将这些内容整理组织成***的章节。
(2)将所需的传统的地方志资源进行数字化，处理成相应的可用的数据资源；
目前的地方志资源大多是各地政府所保存下来的各年代所编制的地方史籍等刊物，大多数都是纸质的资源，数字资源较少。所以需要将纸质的资源转化为电子资源，具体可以通过扫描或其他文字、图像识别等方式。
(3)对处理好的数据资源的呈现进行设计，具体涉及三个模块的设计：信息模块设计、布局模块设计、交互模块设计；
所述信息模块设计用于对页面所要显示的内容信息进行设计，包括方志目录导航设计，内容信息呈现形式设计。方志目录导航的设计可以模拟纸质书的目录的形式将各章节的主题内容和页码清晰的展示出来。在对内容信息呈现形式设计时要根据所呈现的具体信息内容特点按照人们最能直观理解的方式和思维习惯进行设计，可以根据各部分内容的特点，选取合适的方式进行不同形式的呈现，如文字、图片、音频等方式，使用户能够更加直接的了解资源内容，同时提高他们的兴趣。比如在地方志中经常会描述一个地方的历史轨迹，如果用单纯的文字描述的话阅读起来会不太清晰，所以我们可以采用鱼骨图以时间为主线的方式展示该地方在各个时间段所发生的重大事情。
所述布局模块设计用于对页面的排版布局进行设计，包括设计符合地方志特色的背景图；各信息模块排版的设计；以及根据具体方志信息的内容对显示的样式进行优化，使得整个页面符合与地方志的主题相符，且看起来内容清晰，界面样式合理、美观。主要包括将各部分的内容放在合适的地方；对整个页面的背景根据章节的主题内容进行美化；对文字的字体、大小，段落间距、对齐方式等进行设计调整；对图片的大小、格式等进行调整。使整个页面看起来更美观、更舒适。
所述交互模块设计用于对用户与界面的交互形式进行设计。通俗来说就是指，对某一个对象设置一个事件(比如点击)，如果在该对象上触发了该事件，页面会进行响应(比如弹出一个对话框)。根据不同的情况选择合适、易用的交互形式，并且要将交互对象突出显示，使用户能直观看出该对象可以进行交互。需要注意的是不同终端人机交互的方式不同，pc端主要包括鼠标事件和键盘事件，而移动端主要使用的是触摸事件，所以在设计的过程中要对两个不同终端分别进行交互设计。
(4)根据相应模块，选取相应的技术，对pc端和移动端分别进行设置，对各模块进行技术实现；具体包括：信息模块实现、布局模块实现、交互模块实现；
其中，如图2所示，信息模块的实现首先是将信息模块设计的具体信息呈现形式制作出来，根据所设计的呈现形式利用对应的软件进行制作，比如将上述信息模块所说的历史轨迹呈现图用图片处理软件制作出来，然后利用html5语言根据信息模块的设计对所要呈现的数据资源进行编写。要注意的是为了使页面在移动端能够更加完美的适合屏幕显示，需要在html头文件中增加对页面视区的设置，使得页面视区与设备宽度相等，并禁止缩放。本实施方式的具体做法为：添加viewport标签，将内容信息里的属性设置为宽度等于设备宽度，初始缩放比例、最小、最大缩放比例分别设置为‘1.0’，是否允许用户缩放设置为‘no’。即<meta name＝"viewport"content＝"width＝device-width,initial-scale＝1.0,maximum-scale＝1.0,minimum-scale＝1.0,user-scalable＝no"/>。
如图3所示，布局模块的实现是在css3层叠样式表中添加媒体查询工具创建响应式布局，对不同范围内的显示区域宽度设置不同的布局样式。由于不同设备的大小不同，可以利用设备的大小为不同的设备定制不同的页面布局。例如，对iPad设置样式，因为iPad正常屏幕显示宽度在768px到1024px之间，可以在css中添加如下代码：@media only screenand(min-width:768px)and(max-width:1024px){/*具体样式属性*/}。
如图4所示，交互模块的实现是指应用JavaScript脚本语言对交互模块设计中pc端和移动端的交互事件同时进行编写，使得在两种终端都能实现。由于pc端和移动端设备特性不同，所以交互方式也不一样。pc端的交互事件主要有鼠标、键盘事件，移动端的则主要是触摸事件。这里要说明的是，在pc端可以使用JavaScript中原有的click、onmouseover、onmouseout等对鼠标点击、鼠标上划、鼠标移出进行事件设置；但是在移动端由于click事件会有300ms延时，考虑到用户体验，不建议使用click事件，这里提供一种自定义的tap点击事件的方法：封装一个tap函数，通过判断执行touchstart和touchend时的位移差是否小于一个位移值来判断是否执行点击事件，具体代码如下，其中函数参数中element表示事件对象，handel表示所要执行的事件函数：
(5)将实现三种模块所生成的代码进行整合，将布局模块实现时生成的css代码和交互模块实现时生成的JavaScript代码链入html代码中。
本说明书中未作详细描述的内容，属于本专业技术人员公知的现有技术。
Claims (7)
1.一种地方志资源跨平台可视化方法，其特征在于，该方法包括以下步骤：
(1)对传统的地方志资源进行收集、整理、组织，收集各类相关的方志文献、图片、视频，将这些内容整理组织成***的章节；
(2)将所需的传统的地方志资源进行数字化，通过扫描或其他文字、图像识别方式处理成相应的可用的数据资源；
(3)对处理好的数据资源的呈现进行设计，具体包括信息模块设计、布局模块设计、交互模块设计；
(4)根据相应模块，选取相应的技术，对pc端和移动端分别进行设置，对各模块进行技术实现；
(5)将实现三种模块时所生成的代码进行整合，将布局模块实现时生成的代码和交互模块实现时生成的代码链入信息模块实现时生成的代码中。
2.根据权利要求1所述的地方志资源跨平台可视化方法，其特征在于：所述信息模块设计用于对页面所要显示的内容信息进行设计，包括方志目录导航、内容信息呈现形式设计，所述方志目录导航模拟纸质书的目录的形式将各章节的主题内容和页码清晰的展示出来，内容信息呈现形式设计是根据所呈现的具体信息内容特点，选取合适的方式进行不同形式的呈现，包括文字、图片、音频方式。
3.根据权利要求1所述的地方志资源跨平台可视化方法，其特征在于：所述布局模块设计用于对各个终端平台的页面的布局及样式分别进行设计，包括设计符合地方志特色的背景图、各信息模块排版的设计、以及根据具体方志信息的内容对显示的样式进行优化。
4.根据权利要求1所述的地方志资源跨平台可视化方法，其特征在于：所述交互模块设计用于对用户与页面的交互形式进行设计，即用户触发一个动作事件，页面做出相应的响应；包括目录导航交互的设计；对手写旧志中批注、删改的内容进行交互的设计；将地方志内容中较多生僻的需要注释的内容进行交互的设计；对页面的切换及其他特定的需要交互的元素进行交互的设计；不同终端人机交互的方式不同，pc端包括鼠标事件和键盘事件，移动端使用触摸事件。
5.根据权利要求1所述的地方志资源跨平台可视化方法，其特征在于：信息模块的实现首先是将信息模块设计的具体内容信息呈现形式制作出来，根据所设计的呈现形式利用对应的软件进行制作，然后利用html5语言根据信息模块的设计对所要呈现的数据资源进行编写，为了使页面在移动端能够更加适合屏幕显示，需要在html头文件中增加对页面视区的设置，使得页面视区与设备宽度相等，并禁止缩放，具体做法为：添加viewport标签，将内容信息里的属性设置为宽度等于设备宽度，初始缩放比例、最小、最大缩放比例分别设置为‘1.0’，是否允许用户缩放设置为‘no’。
6.根据权利要求1所述的地方志资源跨平台可视化方法，其特征在于：布局模块的实现是利用响应式布局编写层叠样式表，根据查询媒体设备屏幕大小的方式设定对应设备的显示样式，使浏览器依据具体设备进行选择性的样式呈现，使用户在每个不同的设备上都能看到内容一致，且界面布局显示最合适的页面。
7.根据权利要求1所述的地方志资源跨平台可视化方法，其特征在于：交互模块的实现是应用JavaScript脚本语言对交互模块设计的pc端和移动端的交互事件同时进行编写，使得在两种终端都能实现，在pc端使用JavaScript中原有的click、onmouseover、onmouseout对鼠标点击、鼠标上划、鼠标移出进行事件设置；在移动端提供一种自定义的tap点击事件的方法：封装一个tap函数，通过判断执行touchstart和touchend时的位移差是否小于一个位移值来判断是否执行点击事件。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710607058.6A CN107562450A (zh) | 2017-07-24 | 2017-07-24 | 一种地方志资源跨平台可视化方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710607058.6A CN107562450A (zh) | 2017-07-24 | 2017-07-24 | 一种地方志资源跨平台可视化方法 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN107562450A true CN107562450A (zh) | 2018-01-09 |
Family
ID=60974575
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201710607058.6A Pending CN107562450A (zh) | 2017-07-24 | 2017-07-24 | 一种地方志资源跨平台可视化方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN107562450A (zh) |
Cited By (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN108874857A (zh) * | 2018-04-13 | 2018-11-23 | 重庆三峡学院 | 一种方志文献的辑录与数字化体验*** |
| CN110119453A (zh) * | 2019-03-12 | 2019-08-13 | 重庆三峡学院 | 一种基于WebGIS的地方志文献可视化方法及*** |
| CN110334163A (zh) * | 2019-05-22 | 2019-10-15 | 平安国际智慧城市科技股份有限公司 | 大数据的地图背景优化方法、装置、设备及存储介质 |
| CN112733504A (zh) * | 2020-10-09 | 2021-04-30 | 郑杨 | 用计算机语言编纂地方志书的方法 |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN105512095A (zh) * | 2014-09-25 | 2016-04-20 | 北大方正集团有限公司 | Epub电子书的生成方法 |
| CN106445520A (zh) * | 2016-09-23 | 2017-02-22 | 北京赢点科技有限公司 | 一种可视化专题页面制作方法及装置 |
| CN106951156A (zh) * | 2016-01-06 | 2017-07-14 | 阿里巴巴集团控股有限公司 | 一种跨平台交互式电子书的实现方法、装置及*** |
-
2017
- 2017-07-24 CN CN201710607058.6A patent/CN107562450A/zh active Pending
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN105512095A (zh) * | 2014-09-25 | 2016-04-20 | 北大方正集团有限公司 | Epub电子书的生成方法 |
| CN106951156A (zh) * | 2016-01-06 | 2017-07-14 | 阿里巴巴集团控股有限公司 | 一种跨平台交互式电子书的实现方法、装置及*** |
| CN106445520A (zh) * | 2016-09-23 | 2017-02-22 | 北京赢点科技有限公司 | 一种可视化专题页面制作方法及装置 |
Cited By (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN108874857A (zh) * | 2018-04-13 | 2018-11-23 | 重庆三峡学院 | 一种方志文献的辑录与数字化体验*** |
| CN110119453A (zh) * | 2019-03-12 | 2019-08-13 | 重庆三峡学院 | 一种基于WebGIS的地方志文献可视化方法及*** |
| CN110334163A (zh) * | 2019-05-22 | 2019-10-15 | 平安国际智慧城市科技股份有限公司 | 大数据的地图背景优化方法、装置、设备及存储介质 |
| CN112733504A (zh) * | 2020-10-09 | 2021-04-30 | 郑杨 | 用计算机语言编纂地方志书的方法 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US6859909B1 (en) | System and method for annotating web-based documents | |
| CN101916245B (zh) | 一种电子阅读器上电子书批注实现方法和装置 | |
| CN102349087B (zh) | 自动提供与捕获的信息例如实时捕获的信息关联的内容 | |
| CN102902661B (zh) | 一种实现电子书超链接的方法 | |
| CA2372544C (en) | Information access method, information access system and program therefor | |
| CN101025738B (zh) | 一种免模板动态网站生成方法 | |
| CN110738037B (zh) | 用于自动生成电子表格的方法、装置、设备及存储介质 | |
| CN103472983B (zh) | 定位页面内容的方法及装置 | |
| CN104317949B (zh) | 文档片段内容提取方法、装置和*** | |
| US20120030553A1 (en) | Methods and systems for annotating web pages and managing annotations and annotated web pages | |
| CN107562450A (zh) | 一种地方志资源跨平台可视化方法 | |
| US20070061703A1 (en) | Method and apparatus for annotating a document | |
| US20050066267A1 (en) | Information processing system and method, program, and recording medium | |
| CN103778200B (zh) | 一种报文信息源抽取方法及其*** | |
| JP2009524883A (ja) | デジタルコンテンツのネットワークへの提示 | |
| US10650186B2 (en) | Device, system and method for displaying sectioned documents | |
| CN105988568A (zh) | 获取笔记信息的方法和装置 | |
| CN103268340B (zh) | 基于层次式索引的版式可回流文件建立和绘制方法 | |
| CN103761277A (zh) | 一种ePub电子书的加载方法和*** | |
| US20150121203A1 (en) | System and method for generating uniform format pages for a system for composing messages | |
| CN104915186B (zh) | 一种制作页面的方法和装置 | |
| CN107203498A (zh) | 一种创建电子书的方法、***及其用户终端和服务器 | |
| CN105824788A (zh) | 一种将演示文稿文件转换为word文件的方法和*** | |
| WO2014194321A2 (en) | Method and apparatus for browsing information | |
| US10628526B2 (en) | Providing suggested diagrammatic representations of user entered textual information |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20180109 |
|
| RJ01 | Rejection of invention patent application after publication |