RSS/Atom feed Twitter
Site is read-only, email is disabled

how to create something like harvey balls

This discussion is connected to the gimp-user-list.gnome.org mailing list which is provided by the GIMP developers and not related to gimpusers.com.

This is a read-only list on gimpusers.com so this discussion thread is read-only, too.

4 of 4 messages available
Toggle history

Please log in to manage your subscriptions.

how to create something like harvey balls Bob Meetin 15 Jun 19:07
  how to create something like harvey balls Chris Mohler 15 Jun 21:35
   how to create something like harvey balls Bob Meetin 16 Jun 16:06
  how to create something like harvey balls saulgoode@flashingtwelve.brickfilms.com 15 Jun 21:35
Bob Meetin
2010-06-15 19:07:31 UTC (about 14 years ago)

how to create something like harvey balls

Hi,

For a client I am developing a rating system and it will incorporate ratings in 10% increments from 0% to 100%. Is there a smart way in GIMP to fairly precise images. I will probably start at about 30px square and downsize if necessary. I may wish to add some additional increments between 0-10 and 90-100 as eye food.

To see what Harvey Balls look like visit: http://www.ambor.com/public/hb/harveyballs.html

I gave it a try last night using the measure tool to mark up approximate angles then the path tool to actually create the slices. They look fair, will certainly need to be redone befor golive, but it seems like there should be a smarter way to do this.

My first set of images: http://www.dottedi.biz/images/ratings

Thx, Bob

Chris Mohler
2010-06-15 21:35:03 UTC (about 14 years ago)

how to create something like harvey balls

On Tue, Jun 15, 2010 at 12:07 PM, Bob Meetin wrote:

I gave it a try last night using the measure tool to mark up approximate angles then the path tool to actually create the slices.  They look fair, will certainly need to be redone befor golive, but it seems like there should be a smarter way to do this.

I would use Inkscape to draw them and then export PNG files. In Inkscape, after drawing an ellipse look at the start and end parameters: if you punch in 90 for the end (and leave start at 0), you'll have the 25% ball. See the section on ellipses: http://www.inkscape.org/doc/shapes/tutorial-shapes.html

Another approach would be to use SVG directly on the page (either on the fly or saved from Inkscape) - but that is likely not supported well by older browsers.

Chris

saulgoode@flashingtwelve.brickfilms.com
2010-06-15 21:35:26 UTC (about 14 years ago)

how to create something like harvey balls

Quoting Bob Meetin :

Hi,

For a client I am developing a rating system and it will incorporate ratings in 10% increments from 0% to 100%. Is there a smart way in GIMP to fairly precise images. I will probably start at about 30px square and downsize if necessary. I may wish to add some additional increments between 0-10 and 90-100 as eye food.

Start with a white layer. Add a black line along the bottom of the layer. Fill the left N% of the layer with black. Perform a "Filters->Distorts->Polar Coordinates..." with default settings.

Bob Meetin
2010-06-16 16:06:11 UTC (about 14 years ago)

how to create something like harvey balls

I took a look at inkscape and I did review the tutorial-shapes page, but not being familiar with the program, the learning curve is longer than the manual process I went through with GIMP. If there was a tutorial that walked me through step-by-step I could do that. What I did last night in GIMP, which resulted in much better quality images:

1) open a new round layer using Elipse tool 2) fill background with black
3) select shrink - by 2 pixels
4) edit - clear (you end up with a round image with a 2px border and clear background
5) click/select measure tool
6) in my case I want to divide the circle with each section growing by 36 degrees, so I insert the measure tool at the very center pixel and move it to an edge/border approximately 36 degrees from the top center border which shows as 90 degrees. I make a note of that location ( say 30,2 whatever it is )
7) now switch to path tool
8) click once in the images dead center 9) click once at top dead center (in the border) 10) incrementally click along the border until you reach the 36 degree location you noted
11) double-click on the path tool to open tool options and click on selection from path
12) fill with background color
13) save this as the first image

I tried simply adding a copy of the image as a 2nd layer and rotating 36 degrees but it seemed to not seat cleanly so I did the following instead:

1) I made a copy of the first image and opened it 2) with the first image open I totally cropped to the pie piece. 3) do Tools --> Transform Tools --> Rotate and rotate the pie section about 36 degrees
4) copy the section to the new image and move it into place; it becomes the 20% piece
5) repeat this process for each 10% increment

Sometimes when the section rotates some pixels mess up - fix these up manually.

I'm sure that inkscape is a better tool, but the learning curve of a new application works against me here. I'd also considered imagemagick which I'm much more familiar with as a command-line application, but sorting through the coordinates and all would also take substantial time/effort. If anyone wishes to see a tutorial with diagrams I could probably do that this weekend.

Thx, Bob

Chris Mohler wrote:

On Tue, Jun 15, 2010 at 12:07 PM, Bob Meetin wrote:

I gave it a try last night using the measure tool to mark up approximate angles then the path tool to actually create the slices. They look fair, will certainly need to be redone befor golive, but it seems like there should be a smarter way to do this.

I would use Inkscape to draw them and then export PNG files. In Inkscape, after drawing an ellipse look at the start and end parameters: if you punch in 90 for the end (and leave start at 0), you'll have the 25% ball. See the section on ellipses: http://www.inkscape.org/doc/shapes/tutorial-shapes.html

Another approach would be to use SVG directly on the page (either on the fly or saved from Inkscape) - but that is likely not supported well by older browsers.

Chris