ngx-echarts icon indicating copy to clipboard operation
ngx-echarts copied to clipboard

Bmap api is not loaded!

Open kateier opened this issue 5 years ago • 2 comments

ERROR(borswer) is :

ERROR Error: BMap api is not loaded
    at bmap.min.js:22
    at Array.forEach (<anonymous>)
    at each (util.js:298)
    at ExtendedClass.eachComponent (Global.js:449)
    at Function.o.create (bmap.min.js:22)
    at CoordinateSystem.js:52
    at Object.each (util.js:306)
    at CoordinateSystemManager.create (CoordinateSystem.js:51)
    at ECharts.update (echarts.js:773)
    at ECharts.push../node_modules/echarts/lib/echarts.js.echartsProto.setOption (echarts.js:394)

main.ts:

/***
 * echarts extensions
 */
import 'echarts-gl';
import 'echarts/theme/macarons.js';
import 'echarts/dist/extension/bmap.min.js';

share.module.ts:

/** echarts extensions: */
import {NgxEchartsModule} from 'ngx-echarts';

const THIRDMODULES = [
  NgZorroAntdModule,
  CountdownModule,
  UEditorModule,
  NgxTinymceModule,
  **NgxEchartsModule,**
];
// endregion

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    RouterModule,
    ReactiveFormsModule,
    AlainThemeModule.forChild(),
    DelonABCModule,
    DelonACLModule,
    DelonFormModule,
    // third libs
    **...THIRDMODULES,**
    //
  ],
  declarations: [
    // your components
    ...COMPONENTS,
    ...DIRECTIVES,
  ],
  exports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    RouterModule,
    AlainThemeModule,
    DelonABCModule,
    DelonACLModule,
    DelonFormModule,
    // i18n
    TranslateModule,
    // third libs
    ...THIRDMODULES,
    // your components
    ...COMPONENTS,
    ...DIRECTIVES,
  ],
})
export class SharedModule {
}

html: <div echarts [options]="chartOption" (chartInit)="onChartInit($event)" class="demo-chart"></div>

compomnents.ts `

echartsIntance: any;

// 地图 chartOption: EChartOption = { bmap: { center: [116.46, 39.92], zoom: 10, roam: true, }, series: [ { type: 'lines', coordinateSystem: 'bmap', polyline: true, // data: busLines, silent: true, lineStyle: { normal: { // color: '#c23531', color: 'rgb(200, 35, 45)', opacity: 0.2, width: 1 } }, progressiveThreshold: 500, progressive: 200 } ] }; onChartInit(ec) { this.echartsIntance = ec; }

resizeChart() { if (this.echartsIntance) { this.echartsIntance.resize(); } }

`

kateier avatar May 11 '19 03:05 kateier

@owen-carter If you want to use bmap, you need to import BMap JSSDK. Please refer to https://github.com/ecomfe/echarts-bmap You also need to get a license key from https://lbsyun.baidu.com/

xieziyu avatar May 17 '19 02:05 xieziyu

@owen-carter If you want to use bmap, you need to import BMap JSSDK. Please refer to https://github.com/ecomfe/echarts-bmap You also need to get a license key from https://lbsyun.baidu.com/

wow.....thank you for your information.

Credo-Zhao avatar May 27 '19 15:05 Credo-Zhao