python x轴刻度旋转角度,如何在量表中旋转刻度盘？精巧地使用python

I am recently into using plotly package for a gauge chart in python.

After going through the tutorial and template here,

I wonder if there is a way to rotate the "dial" or "needle" given a angle value?

Someone has suggested me using css: transform to do the trick, but still it's hard for me to know how to apply css to the plotly script.

A short and simple code would be great.

Thank you in advance.

解决方案

A bit late to this question. My solution to this problem, though it still needs work is:

I was using the svg path for the dial given in the plotly tutorial, namely

M 0.235 0.5 L 0.24 0.65 L 0.245 0.5 Z

The center point (0.24,0.65) touches the arch of the circle on the inner part of the gauge. Thus, the arch is a circle with its center at (0.24,0.5) and a radius of 0.15.

Given an angle theta in radians, a center (h,k), and expressing a circle in polar form, we can easily obtain cartesian coordinates for a point on the circle at that degree as follows:

x = h + r * cos(theta)

y = k + r * sin(theta)

We can then simply map our input to the expected angle it is supposed to have on the gauge and calculate x and y from there. For my implementation in python, using the math library, this translates to the following:

h = 0.24

k = 0.5

r = 0.15

# Map my_raw_value to degrees. my_raw_value is between 0 and 300

theta = my_raw_value * 180 / 300

# and then into radians

theta = theta * math.pi / 180

x = h + r*math.cos(theta)

y = k + r*math.sin(theta)

path = 'M 0.235 0.5 L ' + str(x) + ' ' + str(y) + ' L 0.245 0.5 Z'

This will dynamically generate the triangle path for your shape and roughly set the long edge of the dial where it is supposed to be. Ideally we would want to rotate the whole thing, since in this implementation the base of the triangle stays static, resulting in a straight line on the limits of the graph.

You would need to multiply all three points on the path by a rotation matrix to get the exact coordinates.