{"spec_id":"lollipop-basic","library":"echarts","language":"javascript","code":"// anyplot.ai\n// lollipop-basic: Basic Lollipop Chart\n// Library: echarts 5.5.1 | JavaScript 22.23.0\n// Quality: 88/100 | Created: 2026-07-01\n\nconst t = window.ANYPLOT_TOKENS;\n\n// --- Data (average annual salary by profession, USD thousands) --------------\nconst professions = [\n  \"Software Eng.\", \"Data Scientist\", \"Physician\",\n  \"Financial Analyst\", \"UX Designer\", \"Project Manager\",\n  \"Mechanical Eng.\", \"Marketing Mgr.\", \"Nurse\", \"Teacher\"\n];\nconst salaries = [125, 118, 115, 95, 88, 85, 82, 75, 68, 58];\nconst avg = Math.round(salaries.reduce((a, b) => a + b, 0) / salaries.length);\n\n// --- Init -------------------------------------------------------------------\nconst chart = echarts.init(document.getElementById(\"container\"));\n\n// --- Option -----------------------------------------------------------------\nchart.setOption({\n  animation: false,\n  color: t.palette,\n  backgroundColor: \"transparent\",\n  title: {\n    text: \"lollipop-basic · javascript · echarts · anyplot.ai\",\n    left: \"center\",\n    top: 28,\n    textStyle: { color: t.ink, fontSize: 22, fontWeight: \"normal\" }\n  },\n  grid: { left: 90, right: 80, top: 90, bottom: 120 },\n  xAxis: {\n    type: \"category\",\n    data: professions,\n    axisLabel: {\n      color: t.inkSoft,\n      fontSize: 14,\n      rotate: 30,\n      interval: 0\n    },\n    axisLine: { show: false },\n    axisTick: { show: false },\n    splitLine: { show: false }\n  },\n  yAxis: {\n    type: \"value\",\n    name: \"Avg. Annual Salary (USD thousands)\",\n    nameLocation: \"middle\",\n    nameGap: 65,\n    nameTextStyle: { color: t.inkSoft, fontSize: 14 },\n    min: 0,\n    max: 150,\n    axisLabel: { color: t.inkSoft, fontSize: 14 },\n    axisLine: { show: false },\n    axisTick: { show: false },\n    splitLine: { lineStyle: { color: t.grid } }\n  },\n  series: [\n    {\n      type: \"bar\",\n      data: salaries,\n      barWidth: 2,\n      itemStyle: { color: t.palette[0] },\n      markLine: {\n        symbol: \"none\",\n        silent: true,\n        lineStyle: { color: t.inkSoft, type: \"dashed\", width: 1.5 },\n        label: {\n          position: \"end\",\n          formatter: \"Avg: \" + avg + \"K\",\n          color: t.inkSoft,\n          fontSize: 13\n        },\n        data: [{ yAxis: avg, name: \"Average\" }]\n      },\n      z: 1\n    },\n    {\n      type: \"scatter\",\n      data: salaries,\n      symbolSize: 16,\n      itemStyle: { color: t.palette[0] },\n      label: {\n        show: true,\n        position: \"top\",\n        formatter: \"{c}K\",\n        color: t.inkSoft,\n        fontSize: 13\n      },\n      z: 2\n    }\n  ]\n});\n"}