67Echarts - 散点图(Basic Scatter Chart)

简介: 67Echarts - 散点图(Basic Scatter Chart)
效果图

源代码
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="js/echarts.min.js"></script>
  </head>
  <body>
    <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">
      // 基于准备好的dom,初始化echarts实例
      var myChart = echarts.init(document.getElementById('main'));
      var option;
      option = {
        xAxis: {},
        yAxis: {},
        series: [{
          symbolSize: 20,
          data: [
            [10.0, 8.04],
            [8.0, 6.95],
            [13.0, 7.58],
            [9.0, 8.81],
            [11.0, 8.33],
            [14.0, 9.96],
            [6.0, 7.24],
            [4.0, 4.26],
            [12.0, 10.84],
            [7.0, 4.82],
            [5.0, 5.68]
          ],
          type: 'scatter'
        }]
      };
      myChart.setOption(option);
    </script>
  </body>
</html>
目录
相关文章
152Echarts - 旭日图(Basic Sunburst)
152Echarts - 旭日图(Basic Sunburst)
66 0
146Echarts - 矩形树图(Basic Treemap)
146Echarts - 矩形树图(Basic Treemap)
201 0
105Echarts - K 线图(Basic Candlestick)
105Echarts - K 线图(Basic Candlestick)
64 0
|
2月前
echarts中使用散点scatter更改颜色却不生效的问题
本文讨论了在ECharts中使用散点图(scatter)时更改颜色不生效的问题。原因是项目中使用了`visualMap`组件,它具有最高的优先级,导致自定义的颜色设置被覆盖。解决方法是在`visualMap`组件中增加`seriesIndex`属性,指定它只对特定的系列(series)生效,从而避免影响散点图的颜色设置。文章提供了详细的代码示例和解决办法。
56 2
195Echarts - 自定义系列(Error Scatter on Catesian)
195Echarts - 自定义系列(Error Scatter on Catesian)
22 0
244Echarts - 3D 散点图(3D Scatter with Scatter Matrix)
244Echarts - 3D 散点图(3D Scatter with Scatter Matrix)
53 0
242Echarts - 3D 散点图(3D Scatter with Dataset)
242Echarts - 3D 散点图(3D Scatter with Dataset)
135 0
211Echarts - 数据区域缩放(Error Scatter on Catesian)
211Echarts - 数据区域缩放(Error Scatter on Catesian)
32 0
163Echarts - 桑基图(Basic Sankey)
163Echarts - 桑基图(Basic Sankey)
71 0
158Echarts - 平行坐标系(Scatter Matrix)
158Echarts - 平行坐标系(Scatter Matrix)
29 0

热门文章

最新文章