Блог

У меня есть следующий код для кнопки highcharts, которая переключает полноэкранный режим. API Highcharts отформатирован таким образом, что я могу изменить тему кнопки в обычном состоянии, состоянии наведения, нажатом состоянии и отключенном состоянии. Я хочу начать с нормального состояния. Ссылка на api выглядит так

https://api.highcharts.com/class-reference/Highcharts.SVGRenderer#кнопка

 button(text, x, y, callback [, theme] [, hoverState] [, pressedState] [, disabledState] [, shape] [, useHTML])
 

для темы он указан как highcharts

 chart: {
        ...,
        events: {
            render: function() {
                var chart = this,
                    x = 10,
                    y = chart.plotTop   chart.plotHeight   50;

                if (!chart.customToggleBtn) {
                    chart.customToggleBtn = chart.renderer.button(
                        'Toggle fullscreen',
                        null,
                        null,
                        function() {
                            chart.fullscreen.toggle();
                        }).add();
                }

                chart.customToggleBtn.attr({
                    x: x,
                    y: y
                });
            }
        }
    }
 

У меня есть svg со следующим форматированием, можно ли заменить кнопку этим svg?

 <svg height='100px' width='100px'  fill="#000000" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" x="0px" y="0px" viewBox="0 0 100 100"><g transform="translate(0,-952.36205)"><path style="text-indent:0;text-transform:none;direction:ltr;block-progression:tb;baseline-shift:baseline;color:#000000;enable-background:accumulate;" d="m 79.960696,970.34239 a 2.000005,2.000005 0 0 0 -0.2188,0.0312 l -15.1875,0 a 2.0000051,2.0000046 0 1 0 0,4 l 10.625,0 -18.7812,18.75 a 2.0108349,2.0108349 0 1 0 2.8437,2.84375 l 18.75,-18.78125 0,10.625 a 2.0000051,2.0000046 0 1 0 4,0 l 0,-15.25 a 2.000005,2.000005 0 0 0 0,-0.375 2.0000051,2.0000046 0 0 0 0,-0.0312 2.000005,2.000005 0 0 0 -1.2812,-1.65625 2.0000051,2.0000046 0 0 0 -0.1563,-0.0625 2.000005,2.000005 0 0 0 -0.5937,-0.0937 z" fill="#000000" fill-opacity="1" fill-rule="evenodd" stroke="none" marker="none" visibility="visible" display="inline" overflow="visible"></path><path style="text-indent:0;text-transform:none;direction:ltr;block-progression:tb;baseline-shift:baseline;color:#000000;enable-background:accumulate;" d="m 19.804389,970.37364 a 2.0000051,2.0000046 0 0 0 -1.8125,2 l 0,15.4375 a 2.0000051,2.0000046 0 1 0 4,0 l 0,-10.625 19.125,19.1563 a 2.0108703,2.0108703 0 1 0 2.8438,-2.8438 l -19.1563,-19.125 10.625,0 a 2.0000051,2.0000046 0 1 0 0,-4 l -15.4375,0 a 2.0000051,2.0000046 0 0 0 -0.1875,0 z" fill="#000000" fill-opacity="1" fill-rule="evenodd" stroke="none" marker="none" visibility="visible" display="inline" overflow="visible"></path><path style="text-indent:0;text-transform:none;direction:ltr;block-progression:tb;baseline-shift:baseline;color:#000000;enable-background:accumulate;" d="m 42.304389,1007.8111 a 2.000005,2.000005 0 0 0 -1.1875,0.5938 l -19.125,19.1562 0,-10.625 a 2.0000051,2.0000046 0 0 0 -2.0312,-2.0312 2.0000051,2.0000046 0 0 0 -1.9688,2.0312 l 0,15.4375 a 2.0000051,2.0000046 0 0 0 2,2 l 15.4375,0 a 2.0000051,2.0000046 0 1 0 0,-4 l -10.625,0 19.1563,-19.125 a 2.000005,2.000005 0 0 0 -1.4688,-3.4375 2.000005,2.000005 0 0 0 -0.1875,0 z" fill="#000000" fill-opacity="1" fill-rule="evenodd" stroke="none" marker="none" visibility="visible" display="inline" overflow="visible"></path><path style="text-indent:0;text-transform:none;direction:ltr;block-progression:tb;baseline-shift:baseline;color:#000000;enable-background:accumulate;" d="m 57.616896,1008.1861 a 2.000005,2.000005 0 0 0 -1.2187,3.4375 l 18.7812,18.75 -10.625,0 a 2.0000051,2.0000046 0 1 0 0,4 l 15.25,0 a 2.000005,2.000005 0 0 0 1.3125,-0.3438 2.0000051,2.0000046 0 0 0 0.0313,0 2.000005,2.000005 0 0 0 0.7187,-0.9375 2.0000051,2.0000046 0 0 0 0.0625,-0.1562 2.000005,2.000005 0 0 0 0.0625,-0.8125 l 0,-15.1875 a 2.0000051,2.0000046 0 0 0 -2.0312,-2.0312 2.0000051,2.0000046 0 0 0 -1.9688,2.0312 l 0,10.625 -18.75,-18.7812 a 2.000005,2.000005 0 0 0 -1.4375,-0.5938 2.000005,2.000005 0 0 0 -0.1875,0 z" fill="#000000" fill-opacity="1" fill-rule="evenodd" stroke="none" marker="none" visibility="visible" display="inline" overflow="visible"></path></g></svg>