ngx-echarts
ngx-echarts copied to clipboard
Bmap api is not loaded!
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(); } }
`
@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/
@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.