Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   График в canvas на javascript (https://javascript.ru/forum/misc/84370-grafik-v-canvas-na-javascript.html)

Signal 21.08.2022 14:02
График в canvas на javascript
 
Всех приветствую.
Есть 24 числа, скажем от 4 до 6 в каждой единице из этих 24 значений
типа array(24) 4.2, 5,7, 3.1 и т.д. 24 штуки

, т.е. он получается перевернут
а надо так:

я понимаю, что пропорциями можно все рассчитать, но не математик я и 2-ка была по ней, не въеду

координаты считаю так
let PosY = ((Centered * BuyPrice) / (MaxFPrice));

рони 21.08.2022 14:32
Signal,
подожду переводчика ...

Signal 21.08.2022 14:36
Цитата:
Сообщение от рони (Сообщение 547498)
Signal,
подожду переводчика ...
так, а чего не понятно, координаты картинки с верхнего левого угла, т.е. чем больше число, тем ниже оно на графике расположено, а надо наоборот

рони 21.08.2022 15:12
Signal,
ок, подожду человека который вам ответит, возможно тогда пойму что вы спросили.)))

Signal 21.08.2022 15:24
Цитата:
Сообщение от рони (Сообщение 547500)
Signal,
ок, подожду человека который вам ответит, возможно тогда пойму что вы спросили.)))
ну в тогда так, в 3d моделировании, точка та, которая в 4.42 (чернинькая) должна быть в красненькой точке, т.е. на графике начало координат по оси Y снизу, а на canvase начальноя точка координат сверху, вот и сам вопрос как их трансформировать-то?

рони 21.08.2022 15:27
Signal,
увы мне))) не понимаю ... но на всякий случай ...
<html>
    <head>
        <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
        <script type="text/javascript">
            google.charts.load('current', {'packages':['corechart']});
            google.charts.setOnLoadCallback(drawChart);
            let arr = Array.from({length : 24}, (_, i)=> [i,Math.random() * 2 + 4]);
            const average = arr.reduce((a,b) => a + b[1], 0)/24;
            arr = arr.map( a => [...a, average]);
            function drawChart() {
                var data = google.visualization.arrayToDataTable( [
                    ["data", "test", "average"], ...arr
                ]);

                var options = {
                    title: 'на всякий случай',
                    legend: { position: 'bottom' },
                };

                var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

                chart.draw(data, options);
            }
        </script>
    </head>
    <body>
        <div id="curve_chart" style="width: 900px; height: 500px"></div>
    </body>
</html>

Signal 21.08.2022 15:32
ты правильно скинул, но там система начальных координат одна, у меня же получается разная, на 180 градусов, как мне посоветовали просто отзеркаль от линии оси, да это проканает, но я хочу сразу сетку координат сделать, чтоб просто математически ее пересчитать
т.е. математически, чтоб как были данные, так они и на графике без отзеркаливания

рони 21.08.2022 15:40
Signal,
кто его знает, что тебе надо)))

Signal 21.08.2022 15:48
ну апана, допустим размер canvas 500x300px
точка отсчета с левого верхнего угла, так?
высота 300px
от 0 до 300px
это от 0 до 6.02$
т.е. можно расчитать пропорцией 1$ и сколько это в px будет на графике, так?
только 6.02$ это 0px а 0$ это 300px

рони 21.08.2022 16:49
Signal,
:-?

может кода чуть-чуть?)))
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.


Часовой пояс GMT +3, время: 21:27.
Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице