Построение диаграмм в среде InDesign
Ранее мы уже знакомились со скриптами, позволяющими выполнять построение диаграмм в программном средстве Индизайн. Однако пришло время для рассмотрения и других способов решения такого задания. Его нестандартность заключается в применении шрифтов, которые были разработаны специально для заданного случая. Если вы не знакомы с внутренним устройством шрифтов типа OpenType, это не должно помешать вам быстро и легко научиться строить диаграммы нестандартными способами. Это можно сравнить с электрическим током, ведь ни один из экспертов не может присвоить такой методике четкую градацию, хотя многие специалисты уже давно активно используют её на практике. Внедряться в теоретическую базу OpenType совсем необязательно, но строить диаграммы так может даже малоопытный пользователь программы.
Мы используем набор шрифтов FF Chartwell, разработка которого принадлежит жителю Портленда, Трэвису Кочелу. Всего в семействе насчитывается семь шрифтов, которые подходят для применения к отдельным видам диаграмм. Если покупать такие шрифты по отдельности, то это удовольствие обойдется вам в 25 долларов, но полный комплект стоит в районе 129 долларов. Конечно же, опытные пользователи интернета всегда могут найти необходимые шрифты в сети совершенно бесплатно.
1. Создание и изменение диаграмм кругового типа
Для начала построим фрейм текстового формата с заданием определенной комбинации цифр. Получим заданное выражение в виде формулы, которая представлена на рисунке ниже.
Когда речь идет о круговой диаграмме, общая сумма всех выбранных чисел должна составлять 100. Выполнение такого условия является обязательным. Превышение суммы может привести к появлению хвоста в виде еще одной диаграммы. Что же касается недостатка, то он неминуемо выльется в результативную диаграмму с одним пустым сектором. Также важно, чтобы цифры и символы данной формулы не содержали пробелов.
Зададим каждому числу определенную цветовую гамму, а также воспользуемся шрифтом Chartwell Pies.
Именно с этого момента и начнется магия. Далее текстовый фрагмент фрейма должен быть выделен и использован вместе с функцией OpenType Stylistic Set 1.
Теперь можно полюбоваться результатом. Числовые значения и плюсы предстали перед нами в виде небольшой круговой диаграммы.
Так как по факту диаграмма представляет собой текстовый фрагмент, манипуляции над размерами кегля автоматически приведут к изменению данного фрагмента. Увеличение необходимо проводить не только по вертикали, но и по горизонтали. Результат представлен на рисунке ниже.
Теперь можно продолжить работу, перенеся курсор текстового фрагмента на ту часть фрейма, где располагается диаграмма. После этого выполняется загрузка Story Editor (Ctrl+y).
Так на рабочем экране появится формула в своем изначальном виде 25+7+40+15+13.
Зафиксируем курсор на числе 25, чтобы применить к нему новый цвет на основе панели образцов. В данном случае это малиновый оттенок. Такая манипуляция повлечет за собой изменение цвета соответствующего сектора диаграммы.
Этот способ работы прекрасно подходит для изменения цвета диаграммы, поэтому мы можем продолжить работу в программе Индизайн. Дополним нашу форму буквой А в белом цвете. Результат отображается на изображении ниже.
Теперь наша диаграмма приобрела форму бублика. Размеры дырки в диаграмме будут напрямую зависеть от того, какую именно букву выберет пользователь. Наименьший размер дырки проявится при использовании буквы «а». Буква «Z» покажет самый большой размер. Округлой пустоте всегда можно присвоить и любой другой цвет, пользуясь ранее примененными методами к секторам.
Работа с круговыми диаграммами закончена.
2.Создание и изменение радарных диаграмм
Следует отметить, что последовательность создания таких диаграмм практически не отличается от предыдущего варианта. Однако необходимо применение другого рабочего шрифта Charwell Radar. Числовое значение каждой цифры должно быть в размере меньше 100. Буквы, проставленные перед формульными значениями, определяют цвет рабочей сетки и параметры её конфигурации.
3. Диаграммы другого образца
Набор шрифтов Charwell также подходит для создания и других цветных диаграмм, но делать это нужно строго по инструкции. Процесс построения происходит по таким же правилам, как и фрагменты, описанные ранее. Опытные пользователи таких редакторов также поговаривают, что подобные диаграммы можно строить с помощью Индизайна и Иллюстратора.
Кстати, если вы знаете немецкий язык, вам наверняка будет очень интересно понаблюдать за процессом построения таких диаграмм с соответствующими комментариями на германском сайте ulrich-media.
Наш канал на Youtube
Здравствуйте все, кто работает в Индизайне!
Извещаем вас о том, что на youtube.com работает канал «InDesign Мастерская вёрстки». Там уже размещены более 70 видео с полным описанием как работать с программой DoTextOK. Другие интересные темы, касающиеся работы …
Хитрости и секреты, приемы работы, уроки
Особенности новой версии Индизайна
Описание плагинов, информация о плагинах для работы с Adobe InDesign
Готовые к использованию скрипты для Adobe InDesign
Описание языка, приёмов и методов программирования для Adobe InDesign
Диаграммы в Индизайне
Мы уже рассказывали о скриптах, рисующих диаграммы в Индизайне. Сейчас же будет рассмотрен еще один метод решения этой задачи, метод необычный, так как для рисования используются специально разработанные шрифты. Не являясь специалистом в построении OpenType шрифтов трудно понять, как там всё внутри устроено, хотя пользоваться легко и просто. Это сродни электрическому току — никто из ученых точно не знает, что это такое, но все пользуются. Не будем и мы пытаться разъяснить теоретические основы метода, так как дебри OpenType-построений для нас темнее темного леса. А вот рассказать про создание диаграмм этим методом нам вполне по силам.
Семейство этих удивительных и загадочных шрифтов с названием FF Chartwell было разработано дизайнером по имени Travis Kochel из Портленда, штат Огайо. Оно состоит из 7 шрифтов. Каждый из них предназначен для определенного типа диаграмм. Стоимость одного шрифта — $25, если покупать весь набор, то это обойдется в $129. Хотя пытливый русский пользователь, привыкший к халяве, может его найти на просторах интернета и бесплатно скачать.
1. Построение и редактирование круговых диаграмм
Создаем новый текстовый фрейм, в котором, например, пишем 25+7+40+15 +13. Для простоты дальнейшего изложения будем называть это выражение формулой.
Сумма чисел этой формулы для круговой диаграммы должна равняться 100. Это обязательное условие. Если сумма будет больше, то получим в качестве хвоста часть второй диаграммы. Если сумма меньше 100, то один сектор диаграммы будет пустым. И еще очень важное условие: между всеми знаками этой формулы не должно быть никаких пробелов!
Покрасим числа и применим ко всему тексту шрифт Chartwell Pies
А теперь начинается магия. Выделим весь текст во фрейме и применим к нему OpenType Stylistic Set 1.
Волшебство свершилось! Вместо цифр и плюсов появилась маленькая круговая диаграмма.
Поскольку она есть по сути текст, то за счет увеличения кегля можно увеличить ее размер (не забываем вертикальный размер фрейма тоже увеличить). Вот что получилось:
Продолжаем шаманить. Поставим текстовый курсор во фрейм с диаграммой и загрузим Story Editor (Ctrl+y)
В нем мы увидим нашу первоначальную формулу 25+7+40+15+13
Выделим в Story Editor число 25 и зададим ему другой цвет из панели образцов, например, малиновый. Одновременно с этим изменится цвет сектора на диаграмме
Таким приемом можно изменять цвета диаграммы. Но продолжаем колдовать. Теперь к нашей формуле прибавим букву ‘A’ белого цвета. Что получилось?
Получилась диаграмма в виде бублика! В зависимости от того, какую букву поставите, такой величины и будет дырка в бублике. Самая большая дырка будет с буквой ‘Z’, а самая маленькая — с буквой ‘a’. Цвет дырки красится точно так же, как и сектора.
На этом всё про круговые диаграммы.
2. Построение и редактирование диаграмм в виде радара
Последовательность построения такая же как и в предыдущем случае. Но требуется использовать другой шрифт — Charwell Radar. Каждое число в формуле должно быть меньше чем 100. Перед формулой ставится одна или две буквы, которые отвечают за цвет и конфигурацию сетки, см. рис. ниже.
3. Другие диаграммы
Для создания других диаграмм с использованием семейства шрифтов Charwell скачайте инструкцию. Они строятся аналогично описанным и разобраться с ними вам не составит труда. И еще, говорят, что такие диаграммы можно делать не только в Индизайне, но и в Иллюстраторе.
Видео с процессом создания диаграммы Вы можете посмотреть на немецком сайте ulrich-media (и соответственно с комментариами на немецком языке), пройдя по этой ссылке.
Помогите, плиззз. Как нарисовать график в Индизе?
Наверху диаграммы, внизу график. В Иллюстраторе есть специальный инструмен для этих целей.
Нет, можно конечно и в ИнДи, но как Вы будете данные, в масштабе, выставлять? На глазок?
George
I wish I was a monster you think I am
- 02.11.2009
- #3
Ответ: Помогите, плиззз. Как нарисовать график в Индизе?
НИКАК. В Иллюстраторе рисуйте(то есть делайте на основе ввода данных). или в экселе(перед вставкой почитать темы, которые здесь про экселевские диаграммы писались)
Поставки лицензионного программного обеспечения (пишите в «личку»). www.belrus.info
Remember, never say you can’t do something in InDesign, it’s always just a question of finding the right workaround to get the job done. ©David Blatner
отечеств. про
- 02.11.2009
- #4
Ответ: Помогите, плиззз. Как нарисовать график в Индизе?
Если нужна только одна эта схема, то в индезе она отрисовывается поверх картинки за полчаса максимум. И не нужен никакой иллюстратор.
George
I wish I was a monster you think I am
- 03.11.2009
- #5
Ответ: Помогите, плиззз. Как нарисовать график в Индизе?
@diz@
При приёме работы заказчик скажет, что у него поменялись показатели графика и перерисовывать, да.
Думаю не стоит про отрисовку в Индюке, в данном случае, говорить.
Поставки лицензионного программного обеспечения (пишите в «личку»). www.belrus.info
Remember, never say you can’t do something in InDesign, it’s always just a question of finding the right workaround to get the job done. ©David Blatner
- 03.11.2009
- #6
Ответ: Помогите, плиззз. Как нарисовать график в Индизе?
Графики рисуются на самом деле очень легко при определенном навыке работы с пером. Навык появляется очень быстро. Разницы, где это делать, никакой абсолютно – в инди или люстре, просто в инди быстрее. Либо строятся в специальных программах, которых, как правило, у верстальщика не бывает. Так что ежли у автора изменились показатели, пусть предоставляет графики в удовлетворительном качестве, либо доплачивает за отрисовку и перерисовку статыщ графиков
Я именно о графиках (то, что внизу), не о диаграммах (которые кольцевые и разноцветные наверху).
George
I wish I was a monster you think I am
- 03.11.2009
- #7
Ответ: Помогите, плиззз. Как нарисовать график в Индизе?
Psy
Тихо промолчу про оплату каждой правки заказчиком.
Поставки лицензионного программного обеспечения (пишите в «личку»). www.belrus.info
Remember, never say you can’t do something in InDesign, it’s always just a question of finding the right workaround to get the job done. ©David Blatner
- 03.11.2009
- #8
Ответ: Помогите, плиззз. Как нарисовать график в Индизе?
отечеств. про
- 03.11.2009
- #9
Ответ: Помогите, плиззз. Как нарисовать график в Индизе?
По теме.
Я имел в виду именно отрисовку конкретики. В переводных изданиях, как правило, никогда не меняют подобную информацию, только подставляют русский текст (что гораздо проще лично для меня сделать в индезе).
А эти колечки при некоторой сноровке легко делаются через Pathfinder и ножнички. Ножа, конечно не хватает Но, в конце концов, колечки можно в темпе нарезать в илле и скопировать в индизайн.
А вот переменная информация — естественно своими инструментами должна делаться.
Может кому-то надоест бегать по разным программам и он закажет плагины для быстрого построения графиков и подобных диаграмм
Я бы даже наверное и купил бы подобное, так как графики приходится отрисовывать нередко.
How To Create Pie Charts & Bar Graphs In Adobe InDesign CC
Hi there, in this video we're going to learn how to do Pie charts, Line charts, and Bar graphs, and all sorts of awesome charting type things, well, kind of. You can't really do them in InDesign so I'm going to show you all the tricks and techniques to create them, and bring them into these. All right, let's get on with it.
So the bad news is that InDesign doesn't make graphs itself so we have to use something else, and there's kind of three main ways of doing it. One is with Illustrator, one is with Excel, and one of them is using a font, like Chart work. Now this is not going to be a detailed explanation of how to use all of them because I guess Illustrator is a separate program, so is Excel, but I want to show you how quick and easy it can be to use those options.
So I'm going to make a new page, page 5 here. Let's look at Illustrator. Illustrator has a Graphing tool, it's down here on the left. And you got all the different kinds of graphs. Potentially, we're going to do our Column graph. And all you do is drag out the size you want it to be. Then you fill this data sheet in, it's kind of like using Excel. So in here I might say, '40' is the first one. You can copy and paste this from Excel. I'm just making a random chart here. And when you've got the bits you want click on that little tick, and you've got a Column chart. You can grab your White Arrow, and click on just this first part and say, I want to pick you, so we select on our White Arrow here. Click on this first option, go to 'Properties' and in here, the Fill is going to be 'Maynooth Green'. I can go through and just color out, change the fonts, change the colors in here. Get ready. And all I need to do is copy and paste it.
Now if I copy it with this little data sheet open, if I copy and try paste it into InDesign, it just doesn't come. Doesn’t work, so you close him down, then just select it, go to 'Edit', 'Copy', then 'Edit', 'Paste' in here, and you get it. Cool thing about doing it from Illustrator is that I can go to my 'Object', and I can 'Ungroup' them. And they all become like separate pieces and I can go through here, and change the font and make some adjustments, and kind of work over there. It's nice and editable in InDesign. Now we're not going to go through every feature in Illustrator. I've got an Illustrator course, go check that out. It will go through all the different Illustrator parts.
So say Illustrator is not your thing, and you've been sent stuff in Excel. So let's look at that. I've got a sheet you can open up here, called 'Chart Data', and I've made a little graph in here. Now this is not going to work unless it's in Excel. Google Sheets doesn't work this way. So I've made a little chart in here. Basically all you do is, select all the data you want in your sheet, go to 'Insert', and then here, there's options for different graphs. I've picked, in this case, this first 'Line' graph. It just generates it. Now, it's not going to be editable in InDesign. So what you need to do is, in here I'm going to go and pick 'Home', and I'm going to pick the 'Font' in here. So I've got to do this stuff— what did I pick? Arial Hebrew, it's probably not what I want. I'll just pick 'Regular Arial'. So you can click on here, double click the 'Line', you can go and choose 'Format'.
Again, this is not going to be like a full, how to use Graphing Tool in Excel. I've got a course on that. So I've got a full on Excel course if you want to jump into that one. Now you can do some basic formating in here, probably without any help. Now just click the outside, copy it, paste it into InDesign. The nice thing about it is that it is Vector. So when I scale it up, it's not going to pixelate. You see, if I zoom in, it's all still lovely Vector Graphics. So whichever way you'd like to use, out of those two, either Excel, or Illustrator, those are great ways. I'm going to show you this third option, because it's quite useful. I'm just going to drag him off to the side here.
So, this is a font based way. So this actually can be done in InDesign. You don't have to go to any other product, but you do need a paid font. And the fonts are about US $25. Where do you get them from? You can buy them from lots of places. Currently TypeKit doesn't sell them so you're going to have to go to somewhere else. I use myfonts.com quite often. And what you're looking for is one called Chartwell. So I found Chartwell here, it's got a big gallery of kinds of things you can do with it. It's pretty impressive, some really nice graphs. Now, you can buy, under 'Buying Choices' you can buy the entire font family. And that's seven different fonts, it's Bar charts, Line charts, the works for about 120, I think it's about the same in US dollars, mine's in Euros.
What I wanted though, just underneath, you can buy 'Individual Styles'. So I've just purchased 'Pie charts', and I bought it. There are added VAT for me, so it added up to about €30, I think it's still an okay price for what it does. So, in InDesign now, you download it, and install it, like any other font. Now the way this works, is it works on Ligatures. If I draw out a Type box— zoom in. So where it works is, you need to have numbers that add up to 100. Let's say I've got this, this, plus this. As long as they equal 100, it's going to work.
The other thing you need to do is, every font, wherever your number group needs to be a different color, so I'm going to pick a bit of green, I'll use pink and I'll use yellow, so I've got three different colors. Now what we need to do is change the Stylistic set. So with the Black Arrow, down the bottom, I've got this little O down the bottom. Now I get to switch it from— actually it's not going to work at all. First of all we need to select the font, and make it 'Chartwell', not Roboto. 'Chartwell Pies', there it is there. Yours might already be downloaded as a Pie chart but if yours is like mine, and it hasn't, now I can click on this O down the bottom and click on 'Stylistic Set 1'. Ready, steady…
I'm amazed. I love that it just works that easily. If you can't see any of this down the bottom here you can turn this on by default by going to 'InDesign', 'Preferences', 'Advanced Type'. If you're on a PC, it's under 'Edit', Preferences', 'Advanced Type'. And you can turn on both of these two options down the bottom. That will give you this little ribbon type icon down the bottom ,or you can go to 'Command T' on a Mac, or 'Control T' on a PC, and in here is the option, under 'OpenType', and you can go to 'Stylistic Sets', and turn it on there. Up to you.
So with it on, it's made up a chart and you can see, these slices are made out of the colors. Now it's a bit small. So I can grab my font tool— it's based on the font size. So I'm going to hold down 'Shift', and just raise it up a bit. So that is how to use the chart. I want to turn that off and show you a couple of options. I think it's pretty clever though. You can obviously, let's say I want another slice, and this one's going to go down to 40. Then I'm going to add another slice that's 10. This one's going to be purple. So it's easy to add slices. There he is there. Another thing you can do is you can add a letter to the end. Now the letters adds a little disc to the middle. So if I type in a lower case 'a' and I'm just going to make it black in this instance. It should be white, but I want it black so you can see it. Now I'll turn it back on. You can see, it's made a little black disc in the middle. So that's what the letter does.
Basically the letter, the lower case a is the smallest dot, and the capital Z is the biggest dot you can make. So it goes, lower case a-z, that gives you half the way and then, upper case A-Z gets you the rest of the way. If that doesn't make sense, let's put in an upper case M, and I'm going to make it white or 'Paper'. Turn it on, so that's going to give me probably the thing I want, see that disc here? So sizing wise, lower case a-z gets you that half way, and then upper case A, all the way through to Z gives you the rest of the space, getting bigger. I picked M, which is kind of in the middle there. So that is the CC Chart. It works just as easy with the Line and Bar graph, and the Rows chart. There's some awesome things if you want to get the whole library.
Now two last things I want to show you, is that turning this Stylistic set on and off is not bad, not a big drama. You can use the Story Editor. I rarely use the Story Editor. It's under 'Edit', and there's one called the 'Story Editor'. Basically this is for people— it's kind of like InCopy. It just means that I see the text without any of the formating. It's just plain text editing. The cool thing about it is that I can switch this one out, let's say this one has to be 15 now, and I'll add those other 15 here, 55, you can see, it's just maybe an easier way to work using this option up the top here. Let's say I get rid of this center here. I'm going to close that down now. Let's say I want kind of a Pie chart pushed out. By default I can't do that, so what I'm going to do is I'm going to select it with my Black Arrow, then go up to 'Type' there's one in there called 'Create Outlines'. So it's no longer editable, so you might want a copy of this somewhere.
So I can't go back into my Story Editor now, and adjust it. What I can do is I can ungroup it. Now I've got lots of little pieces here I can work with, so I might want some sort of like slice, kind of pushing out like this, then, some labels to it to say what this exciting slice does. So the rule is you can't do graphs in InDesign, so you need something else to create them. You can either use Illustrator, Excel, or one of these Chartwell fonts, it's up to you. They all have their pros and cons, and I guess, just use the one you find you've got the most skills in. Either Excel, Illustrator, or you can learn how to use this Chartwell font.