highcharts / highcharts-editor

https://www.highcharts.com/products/highcharts-editor
Other
250 stars 96 forks source link

How would I integrate with Yii #135

Closed jonny7 closed 7 years ago

jonny7 commented 7 years ago

If someone could label this as a "question" that would be helpful. Just wondering the best approach to integrating this within a Yii2 application or anything runs off composer?

arogachev commented 7 years ago

@jonny7 You have the following options:

1) Download .zip archive from releases as described in README.

2) Clone the repository and manually build from sources (NPM is required) as described in README:

git clone https://github.com/highcharts/highcharts-editor
cd highcharts-editor
npm install
gulp

3) Install via NPM:

npm install highcharts-editor --save

Note that NPM packages' versions are different from Github's (for example 1.1.3 NPM package version corresponds 0.1.3 on Github).

4) Install via Composer Asset Plugin. Include this in your composer.json:

"require": {
    "npm-asset/highcharts-editor": "^1.1.3"
}

See NPM mapping section in README for more details.

To include or not include library under version control and how and where execute build (on development or production server) - it's up to you and depends on your conditions.

For example in my project this is the only NPM package plus I have some memory problems when using NPM on production server. So I decided to download it via NPM locally and then use rsync to upload it on production during deploy process.

jonny7 commented 7 years ago

Thanks @arogachev

As it's a .js library, how would you include it within your views for example. What's the best way within a Yii2 context?

jonny7 commented 7 years ago

Figured it out.

Installed using point 4.

Registered a new Asset:

class HighedAsset extends AssetBundle
{
    public $sourcePath = '@npm/highcharts-editor';
       public $css = [
           'files/highcharts-editor.min.css',
       ];
       public $js = [
            'files/highcharts-editor.min.js',
            'files/highcharts-editor.advanced.min.js',
            'https://code.highcharts.com/stock/highstock.js',
            'https://code.highcharts.com/adapters/standalone-framework.js',
            'https://code.highcharts.com/highcharts-more.js',
            'https://code.highcharts.com/highcharts-3d.js',
            'https://code.highcharts.com/modules/data.js',
            'https://code.highcharts.com/modules/exporting.js',
            'https://code.highcharts.com/modules/funnel.js',
            'https://code.highcharts.com/modules/solid-gauge.js',
       ];
}

Then registered the asset:

use app\assets\HighedAsset;
HighedAsset::register($this);
arogachev commented 7 years ago

@jonny7 Yes, asset bundles is the recommended way of managing CSS / JS dependencies in Yii2. See more info in official docs in Assets section.