NEW BLOCK SNEAK PEEK: Circular Diagram!

Permalink
I am releasing a new block in the marketplace very soon (possibly this week)! It allows you to enter up to 10 fields and percents, and display the data in a cool circular diagram!

It will have full customization options, including colors, for full creative expression and style!

It would be perfect for displaying a "Top 10", or "5 Most Popular..", or whatever you can think of!

Here it is... a sneak preview of it! Go to the link, and interactive with it to see it in action!

http://www.growthcurve.co/about/block-demos/circular-diagram/...

PineCreativeLabs
 
jeckerman replied on at Permalink Reply
jeckerman
Nice work! Once I see it up for review, I'll definitely test it out and give it a good run. Looking forward to it!

- Josh
zoinks replied on at Permalink Reply
I like that Adult is 100% :)
jeckerman replied on at Permalink Reply
jeckerman
Hah, nice catch. Good stuff. :-)

- Josh
notzen replied on at Permalink Reply
notzen
Hi,

interesting block with a really good gfx ,

would you consider to put a link that let you to highlight not only on mouse over but also when you click or mouse over the elements in the legend ?

it will be also great the ability to configure for each of the top ten object a link , like you mouse over the drama and eventually you can click and get to the dram page.

just suggestions but I think that they will add good value to the block.
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Good idea! I considered doing that in early development, but forgot to add the option as I was building it.

I'll be sure to add an option that will link ONLY the legend item to a URL specified by the user. The reason I won't link the corresponding arc / circle is because on an iPad (or other touch device) the user has to touch that item to see the percent (acts the same as clicking on it). Obviously, if there was a link within the diagram itself, mobile users wouldn't be able to see the displayed result. So... only the items in the legend will have links.

Thanks for your feedback!
notzen replied on at Permalink Reply
notzen
Thank you!

Off topic :

It Will also fantastic if you Made a block for implement One of this:

Tigra Calendar PRO

Solunas hotel management and online booking engine

Multi User Availability Calendar (looks good)

The reason is that they Are only One script that do bookings , a second block is alleata good to have.
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Although that sounds like a good idea and would be useful for a lot of developers out there, I believe that someone is already working on a booking add-on for Concrete. I'm not entirely sure, though. You may want to suggest that in "Block Requests" in the forums.
gour replied on at Permalink Reply
gour
> Although that sounds like a good idea and would be useful for a lot of developers out there, I believe that someone is already working on a booking add-on for Concrete.

ProEvents Booking (http://www.concrete5.org/marketplace/addons/proevents-booking/) by ChadStrat?
notzen replied on at Permalink Reply
notzen
hi,

I have already a plan to buy the addon from chadstrat,

however my post was about having a second system , or perhaps a bridge to an existent script.

having more choices is better than just one (consider that the proevents-booking need also the calendar and ecommerce) .

probably a whole new script is complicated to do but may be a bridge will be a more realistic solution.

i think that concrete5 in this phase should be more interoperable with external scripts.

this is off course my point of view .

ps. sorry again for the OT . this is my last post about this here.
Shotster replied on at Permalink Reply
Shotster
Hi Brad,

Cool effect and interesting use of SVG. I'm wondering, though, what the configuration options will be, since it's not at all clear to me what the percentages mean. Will there be an option for a caption or descriptive text of any kind, or must the user provide that elsewhere on the page - e.g. in a content block or something?

Nice job,

-Steve
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Currently, the only options will be to customize the colors. However, I do plan to add the following configuration options:

- Add a custom URL link to each of the legend labels (and... if there is a link, it will display a small link icon)
- Ability to select whether or not a link opens in a new window
- Configure the position of the center of the circle (this will be ideal if only 5 items are listed, to save space on the page)
- Set height and width of the diagram
- Set speed of animation
- Others yet to be determined

I also plan to have a screencast for this that will better explain it.

I will try to figure out a way to integrate descriptive labels. Let me know if you have any other suggestions. Thanks for your feedback!
Shotster replied on at Permalink Reply
Shotster


> I will try to figure out a way to integrate descriptive labels.

I was referring to just a single caption for the entire graph. A title would be nice too. For instance, it's unclear what the percentages mean on your sample graph. Percentage of what? Over what time period? etc.

Being able to associate a title and brief textual synopsis with each graph/diagram would be nice.

-Steve
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Ok, I now have a better solution to the additional details: a modal box!

I now plan to integrate a modal box function that, when you click on one of the items in the legend, it opens an overlaying modal box. You'll be able to add a description, and add a link to a page within the site (ex. "More details"). Also, an external URL can be entered, perhaps as reference or something.

The modal box colors will match the ones on the diagram.
Shotster replied on at Permalink Reply
Shotster
Just to clarify what I was suggesting...

Assuming this is more or less like a curved bar graph, I thought it would be good to include a title and caption for the entire diagram. I wasn't suggesting a title and caption for each data point (colored arc) but rather the entire data series (the whole graph).

Also FWIW, to me it would more clearly convey the information if the starting point for each arc was at the same location, thereby making the relative lengths of the arcs more obvious and easier to visually compare.

-Steve
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
I was thinking that the overall diagram title and description would be added via some other block like the default content block included with Concrete.

As far as a starting point, that is one of the options that I will make available as a setting. By default, the arcs are positioned randomly in between two points (ex. 90,360). However, if they were to start at the same point (ex. 180,180), that is something that can be set by the user.

I will be sure to make a screencast that will explain everything.
FernandoCordeiro replied on at Permalink Reply
FernandoCordeiro
Let me also suggest you give the possibility to show only half or 1/4th or the diagram. Maybe just "hide" it waiting for hover, but most likely just give us the possibility to give up a corner of the area for the diagram. The circular design usually creates too many blank spaces, which is why I think not many people use it.

Other than that, best of luck to you, it is amazing. ^^
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
I plan on adding an option to set the dimensions of where the diagram is displayed.

Possible Scenario: Let's say you have 5 or 6 items of data, and they start at the same point. However, none of them are more than 50%, so they don't go all the way around. Obviously, all that extra space would be empty. So.. the simple solution would be to reduce the width (or height) of the diagram container, which will then cut off the unnecessary space.

I hope that helps?
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
ANNOUNCEMENT: I have now updated the demo link above with the newly updated block! Click on the "i" icons to see what they do!
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Attention everyone! This add-on has FINALLY been released!! Go here to check it out:
http://www.concrete5.org/marketplace/addons/circular-diagram...