Chart with ListPages

Posted by gerdami on 28 Sep 2009 20:56, last edited by GoVegan on 24 Jun 2011 02:34

: chart graph horizontal listpages

rating: +4

Chart with Google Chart API

The Google Chart API returns a PNG-format image in response to a URL. Example: http://chart.apis.google.com/chart?chs=250x100&chd=t:60,40&cht=p3&chl=Hello|World will return
chart?chs=250x100&chd=t:60,40&cht=p3&chl=Hello|World.

What if I combine a preset URL with the results of a ListPages module ?

chart?cht=lc&chs=600x300&chf=bg,s,EFEFEF|c,s,66CCFF&chtt=Ratings+distribution&chts=0000FF,16&chm=o,FF9900,0,-1,5.0&chxt=x,y&chxl=0:|HowTos&chxp=0,50&chxr=1,0,50,5&chds=0,50&chd=t:0,134,111,62,55,41,32,23,22,22,21,20,20,17,17,17,16,16,16,16,15,15,15,15,15,14,14,14,13,13,12,12,11,11,11,11,10,10,10,10,10,9,9,9,9,9,8,8,8,8,8,8,8,7,7,7,7,7,7,7,7,7,7,6,6,6,6,6,5,5,5,5,5,5,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0

Code

The code below was inspired by Erich's ListPages Horizontal snippet. I.e. it uses the backslash "\" both in the prependLine and in the module's body. There is a another hack: I had to add a dummy result, zero, otherwise the series of ratings would have begun with a comma.

[[module ListPages category="howto" order="rating desc" perPage="999" separate="false" _
prependLine="[[image http://chart.apis.google.com/chart?cht=lc&chs=600x300&chf=bg,s,EFEFEF|c,s,66CCFF&chtt=Ratings+distribution&chts=0000FF,16&chm=o,FF9900,0,-1,5.0&chxt=x,y&chxl=0:|HowTos&chxp=0,50&chxr=1,0,50,5&chds=0,50&chd=t:0\" _
appendLine="]]"]]
,%%rating%%\
[[/module]]

Limitations:

  • the length of the URL
  • it is currently not possible to dynamically add labels or add other series

Credits

Chart with Listpages and px-trick

This little ListPages block shows the first 20 howto's with a diagram( x10 px) of their ratings ordered by their ratings:

Code

[[module ListPages category="howto" order="rating desc" limit="20" separate="no" prependLine="[[table]]" appendLine="[[/table]]"]]
[[row]]
 [[cell]]
 [/%%fullname%% %%title%%] ( %%rating%% )
 [[/cell]]
 [[cell]]
 [[div style="background-color: #333; height: 30px; width: %%rating%%0px; overflow: hidden"]]
 [[/div]]
 [[/cell]]
[[/row]]
[[/module]]
[[module ListPages category="howto" order="rating desc" limit="20" separate="false" prependLine="[[table]][[row]]" appendLine="[[/row]][[/table]]"]]
 [[cell style="vertical-align: bottom; text-align: center;"]]
 [[div style="background-color: #333; width: 30px; height: %%rating%%0px; overflow: hidden"]]
 [[/div]] [/%%fullname%% %%rating%%]
 [[/cell]]
[[/module]]

See Also

Authors

gerdami gerdami . Please visit his/her userPage.

Helmuti_pdorf does not match any existing user name. Please visit his/her userPage.

James Kanjo James Kanjo . Please visit his/her userPage.

Related articles

Comments

Chart with ListPages: on one day 2 ideas documented!
Helmut_pdorf Helmut_pdorf 29 Sep 2009 07:47

Thanks to gerdami, for the howto Chart with ListPages !

He documented the ratings of our howto#s by using the google.service and I found on the http://roadmap.wikidot.com/ the diagrams with "00px" trick ( by Gabrys I think )..

Have a look!

Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.

Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?

Last edited on 29 Sep 2009 11:53 by gerdami
by Helmut_pdorf Helmut_pdorf , 29 Sep 2009 07:47
Re: Chart with ListPages: on one day 2 ideas documented!
GoVegan GoVegan 29 Sep 2009 10:38

gerdami ! That is A MAZING!

by GoVegan GoVegan , 29 Sep 2009 10:38
Re: Chart with ListPages: on one day 2 ideas documented!
gerdami gerdami 29 Sep 2009 11:52

No, James.
I just cannot reach the expertise level you set with the calendar.
I'm just playing with simple things.

by gerdami gerdami , 29 Sep 2009 11:52
Re: Chart with ListPages: on one day 2 ideas documented!
leiger leiger 29 Sep 2009 12:01

No gerdami, don't sell yourself short. That is chart using the Google API is definitely going to be useful to a lot of people, including myself. Thanks XD

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server

by leiger leiger , 29 Sep 2009 12:01
Re: Chart with ListPages: on one day 2 ideas documented!
leiger leiger 29 Sep 2009 12:17

Look at this! :)

http://cyclods.wikidot.com/test:1

chart?cht=lc&chs=600x300&chf=bg,s,EFEFEF|c,s,66CCFF&chtt=Number+of+Revisions+distribution&chts=0000FF,16&chm=o,FF9900,0,-1,5.0&chxt=x,y&chxl=0:|Skins&chxp=0,50&chxr=1,0,30,5&chds=0,30&chd=t:0,11,10,7,8,13,10,12,7,13,10,15,7,17,5,3,11,4,3,3,3,4,7,3,9,9,7,6,5,1,19,5,4,2,3,8,9,1,4

I'm going to have a lot of fun when %%views%% is released. Real-time statistics!!

If only ListPages could list the value of %%views%% today, one day ago, two days ago, etc.. :P

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server

Last edited on 29 Sep 2009 12:20 by leiger
by leiger leiger , 29 Sep 2009 12:17
Re: Chart with ListPages: on one day 2 ideas documented!
pieterh pieterh 29 Sep 2009 16:07

Yes, this is really clever: mixing ListPages reporting with external tools. I am going to have to write another blog entry, there is too much amazing stuff going on here…

Gerdami, Bravo!

by pieterh pieterh , 29 Sep 2009 16:07
Chart with ListPages... Polls?
Timothy Foster Timothy Foster 29 Sep 2009 18:02

This gave me an idea. Could this be used with the poll system to provide a graphical view of the ratings? That would make the poll system so much better!

Timothy Foster - @tfAuroratide
Auroratide.com - Go here if you're nerdy like me

by Timothy Foster Timothy Foster , 29 Sep 2009 18:02
Re: Chart with ListPages... Polls?
GoVegan GoVegan 30 Sep 2009 00:02

=0

You're god damn right!

@ Gerdami,

Shane's right! You're way too modest, this is fantastic!
Besides, the calendar uses 7 pages for its framework, and these charts use 1 page — you've trumped me!

by GoVegan GoVegan , 30 Sep 2009 00:02
Re: Chart with ListPages... Polls?
Helmut_pdorf Helmut_pdorf 30 Sep 2009 07:34

This is easy:

on the "poll:_template" ( on polls.wikidot.com) there is now the ListPages under

++ Edit poll options:
[[module ListPages category="pollframework" parent="%%page_unix_name%%" order="ratingDesc" separate="no" limit="10000" perPage="10000"]]
# %%linked_title%%
[[/module]]

You have to change it (like the howto:chart..). to

[[module ListPages category="pollframework" parent="%%page_unix_name%%" order="ratingDesc" limit="10000" perPage="10000" prependLine="[[table]]" appendLine="[[row]][[cell]][[/cell]][[cell]][[/cell]][[/row]][[/table]]" separate="no"]]
[[row style="height:30px"]]
 [[cell]]
 [/%%fullname%% %%title%%] ( %%rating%% )
 [[/cell]]
 [[cell]]
 [[div style="align:left; background:#333; height:30px; width:%%rating%%0px; float:left; overflow:hidden"]]
 [[/div]]
 [[/cell]]
[[/row]]
[[/module]]

I am not allowed to do it…

Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.

Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?

by Helmut_pdorf Helmut_pdorf , 30 Sep 2009 07:34
Re: Chart with ListPages...
gerdami gerdami 01 Oct 2009 05:47

Fine, James.
And how do you make a pie chart ?

by gerdami gerdami , 01 Oct 2009 05:47
Re: Chart with ListPages...
Helmut_pdorf Helmut_pdorf 01 Oct 2009 07:15

:))

Interesting…I never thought this is posible to turn 90 degree…

Now i think too about a "pie chart"

Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.

Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?

by Helmut_pdorf Helmut_pdorf , 01 Oct 2009 07:15
Re: Chart with ListPages... Polls?
leiger leiger 01 Oct 2009 09:10

@ James Kanjo
@ Helmuti_pdorf

With the polls website, unless there is a way to allow both types of poll at once (there probably is, based on the calendar mode=mini and mode=full), I think the polls that use this chart idea should be done in a separate category. Some people may still wish to use the current poll system, so that should be kept in some form.

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server

by leiger leiger , 01 Oct 2009 09:10
Michal
leiger leiger 09 Oct 2009 09:02

Just found Michal's twitter by accident… and it mentions this page:

Wikidot users are so creative. I am still kind of shocked: http://bit.ly/BogB1
01 Oct 2009 12:14 from Twitterrific

Footnotes
. This date has been converted to Wikidot syntax… it's dynamic and is based on your timezone

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server

Last edited on 09 Oct 2009 09:05 by leiger
by leiger leiger , 09 Oct 2009 09:02
Footnotes
. I tried to embed several ListPages via include but The ListPages module does not work recursively
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-Share Alike 2.5 License.
Click here to edit contents of this page.
Click here to toggle editing of individual sections of the page (if possible). Watch headings for an "edit" link when available.
Append content without editing the whole page source.
Check out how this page has evolved in the past.
If you want to discuss contents of this page - this is the easiest way to do it.
View and manage file attachments for this page.
A few useful tools to manage this Site.
Change the name (also URL address, possibly the category) of the page.
View wiki source for this page without editing.
View/set parent page (used for creating breadcrumbs and structured layout).
Notify administrators if there is objectionable content in this page.
Something does not work as expected? Find out what you can do.
General Wikidot.com documentation and help section.
Wikidot.com Terms of Service - what you can, what you should not etc.
Wikidot.com Privacy Policy.

AltStyle によって変換されたページ (->オリジナル) /