javascript - Creative ideas for display large amount of text on web page - Stack Overflow

admin管理员组

文章数量:1305675

I have a 2 column table in a database 1,000 rows long(All integer data).
The display will allow for the user to delete a certain range of data from the table.

What I am looking for is a creative way to display all the data so the user can get to different parts of it really fast. Maybe displaying different chunks at once, represent with bar graphs or zooming the scope in/out would be really cool.

Any ideas,suggestions, examples at all are appreciated. Please just throw them out here for brainstorming.

Note: I am limited to JS, xml, html and C

Thanks!

I have a 2 column table in a database 1,000 rows long(All integer data).
The display will allow for the user to delete a certain range of data from the table.

What I am looking for is a creative way to display all the data so the user can get to different parts of it really fast. Maybe displaying different chunks at once, represent with bar graphs or zooming the scope in/out would be really cool.

Any ideas,suggestions, examples at all are appreciated. Please just throw them out here for brainstorming.

Note: I am limited to JS, xml, html and C

Thanks!

• javascript
• html
• c
• xml

Share Improve this question Follow asked Mar 25, 2009 at 22:07 T.T.T.T.T.T. 34.6k4747 gold badges135135 silver badges172172 bronze badges 0

Add a ment  | 

7 Answers 7

Sorted by: Reset to default 3

• By mouse scroll resize the text.
• Add drag'n'drop for moving text block.

Example: user resizes it to a smaller chunk by mouse weal then moves it by using drag'n'drop.

It is possible to implement such thing with jQuery/JavaScript

Use a double slider with a min and max display range. Here is an example of one based on MooTools. Moving the slider controls will adjust which range of values are displayed in the table.

Could implement something that functions like google maps where you can easily zoom in and out and set points wherever you need that stay when you change elevation.

you can format the html with <h1>, <h2>, <h3> and <p> tags, and use jquery to collapse the paragraphs, leaving headings of major sections.

I did this with documentation i was working on and it worked out great.

I'm a fan of the JavaScript bookmarklet demoed in this video: http://www.youtube./watch?v=GPZ8YNgyl_I

The bookmarklet itself is available here: http://t_trace.wed.macserver.jp/overview.html

If you have used WinMerge, you could develop something like the location pane in the left that shows a full preview of the changes in files. It can be used to navigate very fast

Here's a screenshot. (Image too large to inline it here)

Assuming the integer data e in ranges, a mon approach is to show how much data there is in each range as a horizontal bar. You click the range to zoom in, until you see the actual data, or click the X to delete.

    ID Range

[X]    1-1000 xxxxxxxxxxxxxxxxxxxxx

[X] 1001-2000 xxxxxxxxx

[X] 2001-3000 xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

A further refinement is to use colour on the horizontal bars to show data density. For instance red = lots of data, yellow = less

本文标签： javascriptCreative ideas for display large amount of text on web pageStack Overflow