juijs / jui-chart

SVG-based JUI chart that can be used in the browser and Node.js. Support many types of charts. (Dashboard, Map, Topology, Full 3D, Realtime)
https://codepen.io/collection/nLydod/
57 stars 25 forks source link

widget-legend 에서 center가 정확히 맞지 않음 #134

Closed canelia04 closed 7 years ago

canelia04 commented 7 years ago

바로 아래에 있는 legend 에서 항목이 overflow 되는 이슈를 해결하고보니 center가 정확히 맞지 않는 문제도 있네요..

보시면, android 5와 android 6사이에 공백이 있는데 android 6의 우측에도 공백크기만큼 width로 잡혀서 그 크기의 기준 center로 계산되는 듯 합니다..

test

위와 같은 차트를 3개 사용중인데 정확한 해결 방법은 아니지만 아래 코드에서 total_width 에 0.9정도 곱하면 다른 그래프에서도 대략 다 맞는 듯 하네요. 0.88 곱해서 쓰고 있습니다.

x

        // legend 위치  선정
        if (widget.orient == "bottom" || widget.orient == "top") {
            var y = ((widget.orient == "bottom") ?
                chart.area("y2") + chart.padding("bottom") - max_height :
                chart.area("y") - chart.padding("top")) + PADDING;

            if (widget.align == "start") {
                x = chart.area("x");
            } else if (widget.align == "center") {
                x = chart.area("x") + (chart.area("width")/2 - (total_width * 0.88) / 2);
            } else if (widget.align == "end") {
                x = chart.area("x2") - total_width;
            }
easylogic commented 7 years ago

내부적으로 text 구할때 기본 폰트 사이즈랑 실제 svg 에 적용되는 폰트 사이즈를 맞추지 않아서 조금의 차이가 생겼네요.

필요하시면 develop 체크아웃 받아서 테스트 해보실 수 있습니다.