[VueJs] amcharts3 사용하기

설치

npm install amcharts3 --save

사용 샘플 소스

<template>
	<div id="chartdiv" style="width: 100%; height: 400px;" ref="chartdiv" />
</template>

<script>
import 'amcharts3'

import AmSerial from 'amcharts3/amcharts/serial'



export default {

	name: 'AmCharts',
	data: () => ({
		chartConfig: {
			type: 'serial',
			categoryField: 'type',

			chartCursor: {},

			graphs: [
			
	{
				
	type: 'column',
					title: 'Pizza types',

					valueField: 'sold',

					fillAlphas: 0.8

				}

			],

			dataProvider: [

				{ type: 'Margherita', sold: 120 },

				{ type: 'Funghi', sold: 120 },

				{ type: 'Capricciosa', sold: 120 },
				{ type: 'Quattro Stagioni', sold: 120 }
 
			]
		
}
	}),
	created() {
		AmCharts.makeChart(this.$refs.chartdiv, this.chartConfig)
	}
}
</script>

오류 수정

import AmCharts from 'amcharts3'

위 형태로 하면 AmCharts.makeChart() 함수를 찾을 수 없다는 오류가 나와서 수정

참조 URL

https://github.com/developerKumar/AmchartsUse