Эээ, div с border-radius: 50%, канвас, свг, картинки - тут и рисовать то нечего. Уточни, что именно надо.

То, что везде будет работать с минимумом телодвжений. Дивы не везде удобны.

Мне бы вот такое нарисовать: https://github.com/wyldrodney/Rejuick/graphs/punch-card

Точки ставь да и всё.

Гигантского размера? :) А если шрифтов не будет или что-нить полезет? Нужно попиксельно.

Каких «шрифтов не будет», шрифтов с точкой?
И что может полезть? Есть примеры страниц, где некорректно отображаются точки?
Охренели вконец эти юные талантливые вебдизайнеры, уже даже сраную точку и то норовят на канвасе намалевать, лишь бы кулер на проце не замедлялся.

OMG, а почему именно круги?

а вообще - заюзай спрайты или бери несколько PNG файлов с нарисованными кругами разных размеров

Не, костыль. У какого-нибудь юзера они могут оказаться квадратами если с шрифтами у него плохо, некоторые браузеры ставят границы допустимых размеров шрифтов.

Имхо, для такого дивы проще всего, или свг, как собственно у гитхаба и сделано.

http://www.highcharts.com/demo/pie-gradient возможно пригодится, использовал эту библиотеку для отрисовки графиков

processing.js

setup() {
  size(300,300);
  smooth();
  fill(color(255, 0, 0));
}

draw() {
  ellipse(random(0, 300), random(0, 300), 50, 50);
}

как-то так

некоторые браузеры ставят границы допустимых размеров шрифтов

Точно, не подумал.

Ой, да иди ты нахер, дизайнер.

Спасибо, потыкаю :)

processing.js

А оно тормозить не будет?

А оно тормозить не будет?

У меня некоторый код на процессинге работает под JS быстрее, чем под Java

Собственно, понял как делается, поищу ещё библиотеки.

работает под JS быстрее, чем под Java

Это ещё не значит, что оно тормозить не будет. Всё таки процессинг — это такая лёгкая (для программистов) замена флешу для отображения всякой херни на вебстраницах.

Всё таки процессинг — это такая лёгкая (для программистов) замена флешу для отображения всякой херни на вебстраницах.

Будет тормозить не сильнее, чем JS

Не расстраивайся.

круги со сглаженными углами.

XDDDD

svg / canvas / border-radius

Вроде в dojo было, посмотри демо.
Там его можно частями собирать, чтобы всё не тащить.

А как идеологически верно будет?

Речь о том что тащить это для рисования кружочков - палить из пушки (да с ядерным зарядом) по воробьям. Я вообще не пойму, чего ТС мучается, задача тривиальная.

Вон, на 140 символов твита тащится 2Мб скриптов. Им можно, а нам нельзя? :)

Ну, во-первых там давно уже 200 кб на твит и список ответов к нему. Во-вторых, как вообще эта байка относится к вопросу?

И вообще, тяжелая она не только в размере, а в коде и подходе. Что-то типа процессинг.жс там нафиг не нужно. Мы уже на этот тред потратили в разы больше времени чем надо чтоб написать тупые кужочки.

/0

Мне бы вот такое нарисовать: https://github.com/wyldrodney/Rejuick/graphs/punch-card

а что, в исходники глянуть не судьба?

processing.js

Микроскоп → гвозди

Я ещё не занялся решением вопроса вплотную. Доползу только на днях. А тред - чтобы мнения собрать.

Скажешь что я время людей трачу, так как мог сам? Тогда отвечу что вы своими ответами моё время тратите - они никуда (почти все, твой в том числе) не годятся.

Тогда отвечу что вы своими ответами моё время тратите - они никуда (почти все, твой в том числе) не годятся.

Ну так в самом начале предложили же кучу вариантов. Начиная от CSS (что и сделано в том примере) и заканчивая SVG и canvas. Можно вообще в webGL нарисовать. Просто надо выбирать инструмент в зависимости от того, что требуется.

CSS (что и сделано в том примере)

Там свг же. Или у тебя именно цсс?

Вроде по ссылке через CSS

Вроде? Не, может там цсс для браузеров не умеющих свг, я потому и спрашивал.

Тьфу, точно. Я просто в код не вглядывался.

я просто оставлю это здесь