Редактор Highcharts - PullRequest
Новая
       9

Редактор Highcharts

0 голосов
/ 12 декабря 2018

Я рассматриваю возможность покупки Highcharts и мне также интересен редактор (highcharts-editor.complete.js).Но я не могу определить способ инициализации редактора с различными параметрами и данными, которые были ранее сохранены.

Я заметил кнопки «Сохранить проект» и «Открыть проект», но я буду интегрироватьредактор с базой данных и этими кнопками, скорее всего, не будет работать для меня.

Обновление:

Большое спасибо за вашу помощь Войцеху.Я получил биты defaultChartOptions для работы, но я не могу получить событие ChartChange для запуска.Вот фрагмент кода.Еще раз спасибо! 

function chart_changed(s)
{
    console.log(s);
}


highed.ready(function () {

    highed.Editor(document.body,

        {
            defaultChartOptions: {
                "title":{"text":"Cool Chart"},
                "subtitle":{"text":"My Cool Chart"},
                "exporting":{},
                "yAxis":[{"title":{},"labels":{}}],
                "lang":{},
                "credits":{},
                "chart":{},
                "xAxis":[{"title":{},"labels":{}}],
                "data":{"csv":"\"row\";\"val\"\n\"2013-01-01\";24\n\"2014-01-01\";76\n\"2015-01-01\";23"},
                "series":[{"data":[[1356998400000,24],[1388534400000,76],[1420070400000,23]],"name":"val","_colorIndex":0,"_symbolIndex":0}],
                "plotOptions":{"series":{"animation":false}}
            },

            on: {
                'ChartChange': 'chart_changed'
            }
        }


    );
});

К вашему сведению.Я также пробовал: 

            on: {
                'ChartChange': chart_changed
            }

И 

highed.on('ChartChange', chart_changed);

И 

highed.on('ChartChange', function (data) {
    console.log(data);
});

1 Ответ

0 голосов
/ 13 декабря 2018

Вы можете инициализировать редактор с параметрами по умолчанию, передав их в качестве параметра конструктору редактора: 

{
    //The initial chart options
    defaultChartOptions: <object>,
    //Events to listen for - same as calling Editor.on(...)
    on: {
        'EventName': <function>
    },
    //Plugins to use
    plugins: {
        <name of plugin>: <object with plugin options>
    },
    //If true, an SVG chart will be inserted when exporting to provide
    //a fallback when js is not enabled/available.
    includeSVGInHTMLEmbedding: bool,
    //Features to use
    features: 'import export templates customize'
}

Просмотрите эту статью на github, чтобы найти больше информации:
https://github.com/highcharts/highcharts-editor/wiki/Editor-API

Обновление:

Чтобы запустить событие ChartChange, вы можете использовать следующий подход: 

highed.ready(function () {
    var Editor = highed.Editor(document.body, {
        defaultChartOptions: {
            title: {
                text: 'Cool Chart!'
            },
            subtitle: {
                text: 'My Cool Chart!'
            },
            data: {
                csv: "\"row\";\"val\"\n\"2013-01-01\";24\n\"2014-01-01\";76\n\"2015-01-01\";23"
            }
        },
        features: 'import export templates customize'
    });

    Editor.chart.on('ChartChange', function(data) {
        console.log('Chart changed! -> ', data);
    });
});
...