Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit0dcdd2f

Browse files
swetankrathiandrefarzat
authored andcommitted
Feature:#243 - multple CDN support for PlotlyViaCDNModule, including custom CDN.
1 parenteb0c6b6 commit0dcdd2f

File tree

3 files changed

+43
-9
lines changed

3 files changed

+43
-9
lines changed

‎README.md

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -229,6 +229,21 @@ PlotlyViaCDNModule.setPlotlyBundle('basic'); // optional: can be null (for full)
229229
exportclassAppModule { }
230230
```
231231

232+
By default, plotly's CDN is used to fetch the requested bundle.js. However, you can either choose`plotly`,`cloudflare` or`custom`.
233+
234+
```typescript
235+
...
236+
237+
// For cloudflare
238+
PlotlyViaCDNModule.setPlotlyVersion('1.55.2','cloudflare');// cloudflare doesn't support `latest`. It is mandatory to supply version.
239+
PlotlyViaCDNModule.setPlotlyBundle('basic');// optional: can be null (for full) or 'basic', 'cartesian', 'geo', 'gl3d', 'gl2d', 'mapbox' or 'finance'
240+
241+
// For custom CDN URL
242+
PlotlyViaCDNModule.loadViaCDN('custom','https://custom.cdn/url');// can be used directly for any self hosted plotly bundle
243+
244+
...
245+
```
246+
232247
###Plotly Via Window Module
233248

234249
`plotly.js` can be added as a[global script on angular.json](https://github.com/angular/angular-cli/wiki/stories-global-scripts#global-scripts) to avoid it being bundled into the final project's code. To make this happen, you must first add`plotly.js` path into`angular.json` file as shown below:

‎package-lock.json

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more aboutcustomizing how changed files appear on GitHub.

‎projects/plotly/src/lib/plotly-via-cdn.module.ts

Lines changed: 26 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { PlotlySharedModule } from './plotly-shared.module';
66

77

88
exporttypePlotlyBundleName='basic'|'cartesian'|'geo'|'gl3d'|'gl2d'|'mapbox'|'finance';
9-
9+
exporttypePlotlyCDNProvider='plotly'|'cloudflare'|'custom';
1010

1111
@NgModule({
1212
declarations:[],
@@ -23,13 +23,13 @@ export class PlotlyViaCDNModule {
2323
PlotlyService.setModuleName('ViaCDN');
2424
}
2525

26-
publicstaticsetPlotlyVersion(version:string):void{
26+
publicstaticsetPlotlyVersion(version:string,cdnProvider:PlotlyCDNProvider='plotly',cdnURL:string=''):void{
2727
constisOk=version==='latest'||/^(strict-)?\d\.\d{1,2}\.\d{1,2}$/.test(version);
2828
if(!isOk){
2929
thrownewError(`Invalid plotly version. Please set 'latest' or version number (i.e.: 1.4.3) or strict version number (i.e.: strict-1.4.3)`);
3030
}
3131

32-
PlotlyViaCDNModule.loadViaCDN();
32+
PlotlyViaCDNModule.loadViaCDN(cdnProvider,cdnURL);
3333
PlotlyViaCDNModule.plotlyVersion=version;
3434
}
3535

@@ -43,13 +43,32 @@ export class PlotlyViaCDNModule {
4343
PlotlyViaCDNModule.plotlyBundle=bundle;
4444
}
4545

46-
publicstaticloadViaCDN():void{
46+
publicstaticloadViaCDN(cdnProvider:PlotlyCDNProvider='plotly',cdnURL:string=''):void{
4747
PlotlyService.setPlotly('waiting');
4848

4949
constinit=()=>{
50-
constsrc=PlotlyViaCDNModule.plotlyBundle==null
51-
?`https://cdn.plot.ly/plotly-${PlotlyViaCDNModule.plotlyVersion}.min.js`
52-
:`https://cdn.plot.ly/plotly-${PlotlyViaCDNModule.plotlyBundle}-${PlotlyViaCDNModule.plotlyVersion}.min.js`;
50+
letsrc:string='';
51+
switch(cdnProvider){
52+
case'cloudflare':
53+
if(PlotlyViaCDNModule.plotlyVersion=='latest'){
54+
thrownewError(`As cloudflare hosts version specific files, 'latest' as a version is not supported. Please specify a version or you can choose 'plotly' as a CDN provider.`);
55+
}
56+
src=PlotlyViaCDNModule.plotlyBundle==null
57+
?`https://cdnjs.cloudflare.com/ajax/libs/plotly.js/${PlotlyViaCDNModule.plotlyVersion}/plotly.min.js`
58+
:`https://cdnjs.cloudflare.com/ajax/libs/plotly.js/${PlotlyViaCDNModule.plotlyVersion}/plotly-${PlotlyViaCDNModule.plotlyBundle}.min.js`;
59+
break;
60+
case'custom':
61+
if(!(!!cdnURL&&typeofcdnURL==='string')){
62+
thrownewError(`Invalid or missing CDN URL. Please provide a CDN URL in case of custom provider. Alternatively, you can choose from 'plotly' or 'cloudflare'.`);
63+
}
64+
src=cdnURL;
65+
break;
66+
default:
67+
src=PlotlyViaCDNModule.plotlyBundle==null
68+
?`https://cdn.plot.ly/plotly-${PlotlyViaCDNModule.plotlyVersion}.min.js`
69+
:`https://cdn.plot.ly/plotly-${PlotlyViaCDNModule.plotlyBundle}-${PlotlyViaCDNModule.plotlyVersion}.min.js`;
70+
break;
71+
}
5372

5473
constscript:HTMLScriptElement=document.createElement('script');
5574
script.type='text/javascript';

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp