1

При создании графического редактора для прорисовки дуги собираюсь использовать метод arc(double centerX,double centerY,double radiusX,double radiusY,double startAngle, double length). startAngle - угол на окружности в градусах, length - длина дуги в градусах. Как можно определить этот угол (startAngle), если у меня есть координаты центра нарисованного круга и длина радиуса? Код самого метода

public void draw(GraphicsContext gc) {
    gc.beginPath();
    gc.arc(x + center.x, y + center.y, radius, radius, startAngle, length);
    gc.stroke();
}

введите сюда описание изображения

Два слова о принципе моей реализации: при зажатии мыши я по соотвествующим координатам рисую дугу в 360* (у меня есть координаты центра круга и радиус)а вот как дальше вычислить угол не знаю. Заранее спасибо!

2
  • 1
    Может теорема косинусов поможет
    – Andrey M
    30 янв 2017 в 9:58
  • я как раз делал это 3 дня назад только на svg но поскольку анимация там лагает буду переделывать под canvas сегодня напишу ответ (если не забуду)(копать в сторону косинусов и синусов и пи)
    – Gotha
    8 фев 2017 в 3:29

1 ответ 1

1

этот график тебе поможет долго мучался пытался понять как рисовать дуги попрубуй сам решить (если выйдет скинь что вышло у тебя сравним) ближе к часу кину свое решение кодом

   function line(o){
var  X =  o.x||0,  //позиция центра по X 
     Y =  o.y||0,  //позиция центра по Y 
    SP = o.sp||0,  // 1 точка дуги (в пи)
    EP = o.ep||2.0, // 2 точка дуги (в пи)
     R =  o.r||10, // радиус
     S =  o.s||10, //количество точек в дуге
     W = (o.w)? (o.w<=R*2)?o.w:R*2 : 10; //ширина


      W = [R-(W/2),R+(W/2)];// выравниваем ширину по центру
     EP = (EP-SP <= 6.28)?EP:EP-(EP-SP-6.28); // определяем длину дуги и не даем ей быть больше чем 2пи
      P = EP-SP;
      P = (Math.round(P * 100)/100);
 //функция для уменьшения нулей
function mr(Nn){
return (Math.round(Nn * 100)/100)
}

var linP = 'M'+(Math.cos(SP)*W[0]+X)+','+(Math.sin(SP)*W[0]+Y);
//перемещение курсора в точку начала полоски

 linP += ((P == 6.28)?" M":" L")+mr((Math.cos(SP)*W[0]+X))+','+mr((Math.sin(SP)*W[0]+Y));
 linP += ((P == 6.28)?" M":" L")+mr((Math.cos(SP)*W[1]+X))+','+mr((Math.sin(SP)*W[1]+Y));
 //рисование первой закрывающей линии,если круг полный перемещение курсора

for(i=1;i<S;i++){
 var Vect = (i*(P)/(2))/(S/2)+SP;
    linP += ' L'+mr((Math.cos(Vect)*W[1]+X))+','+mr((Math.sin(Vect)*W[1]+Y));
}
linP += ((P == 6.28)?"z":"")
    //рисование ДУГИ если круг полный замыкаем линию.

 //тоже самое только с нижней дугой и 2 закрывающей линией \/
linP += ((P == 6.28)?" M":" L")+mr((Math.cos(EP)*W[1]+X))+','+mr((Math.sin(EP)*W[1]+Y));
linP += ((P == 6.28)?" M":" L")+mr((Math.cos(EP)*W[0]+X))+','+mr((Math.sin(EP)*W[0]+Y));

for(i=S;i>0;i--){
var Vect = (i*(P)/(2))/(S/2)+SP;
linP += ' L'+mr((Math.cos(Vect)*W[0]+X))+','+mr((Math.sin(Vect)*W[0]+Y));
}
  linP += "z"


return linP //на выходе кординаты точек правдо тут еще вписаны буквы для svg
}
5
  • я в данный момент не могу заняться этим вопросом, т.к. пока что другое делаю. ссылку твою обязательно посмотрю. НО, .если ты тоже решаешь данную задачу, то тебе может помочь следующий код: угол отрезка АВ (а-точка на холсте, в - ценрт круга) в радианах можно измерять следующей функцией: pi-atan2(y(B)-y(A),-(x(B)-x(A)))
    – uncleSAM
    8 фев 2017 в 10:57
  • @uncleSAM Твою функцию не понял как применять,но код я скинул там для svg либо прописаны буквы,а так там просто корды. что там делать именно для canvas еще не знаю не разу не работал но врятли сильно изменится запись функции. я только сейчас заметил что ты сейчас по javafx .Код на чистом js надеюсь поймешь )
    – Gotha
    8 фев 2017 в 13:36
  • @uncleSAM я немного глянул canvas (тег в HTML) там уже есть готовая функция по от рисовки дуги но как понимаю тебе не тег canvas нужен то я сделал просто кодом хоть все ровно js но переписать будет несложно на другой язык jsfiddle.net/jkchzhtv )
    – Gotha
    8 фев 2017 в 16:27
  • 1
    ты крут, что тут еще сказать?)
    – uncleSAM
    8 фев 2017 в 23:24
  • просто сам долго мучался в добавок товарищам нужно помогать
    – Gotha
    9 фев 2017 в 14:47

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.