我正在尝试将标签添加到此图表上的散点图: http://bost.ocks.org/mike/d3/workshop/dot-chart.html

我认为稍微修改这段代码会起作用,但它没有:

svg.selectAll(".dot")
  .append("text")
  .text("fooLabelsOfScatterPoints");

解决方法

迈克罗宾逊,你的榜样帮了忙.

对于那些想知道的人,这就是我所做的:

我删除了:

svg.selectAll(".dot")
  .data(data)
  .enter().append("circle")
  .attr("class","dot")
  .attr("cx",function(d) { return x(d.x); })
  .attr("cy",function(d) { return y(d.y); })
  .attr("r",12);

并补充说:

var node = svg.selectAll("g")
                .data(data)
                .enter()
                .append("g");

node.append("circle")
  .attr("class",12);

node.append("text")
  .attr("x",function(d) { return x(d.x); })
  .attr("y",function(d) { return y(d.y); })
  .text("fooLabelsOfScatterPoints");

我将“text”标签添加到“g”标签上,而不是将“text”标签附加到“circle”标签上.

javascript – d3.js:如何为图表上的散点图添加标签的更多相关文章

  1. ios – 如何让SpriteKit Playgrounds在Xcode 8 beta中运行?

    我希望能够在Playgrounds中轻松构建我的SpriteKit代码原型.这在Xcode7中工作正常在Xcode7中,我得到了一个很好的实时视图这在Swift3和Version8.0beta3中不起作用.我需要改变什么?解决方法XCPlayground模块已被PlaygroundSupport取代:

  2. Swift开发教程--如何自定义TabBarItem的图片显示

    在做项目的时候,如果使用系统的UITabBarController的时候,底部的tab自定义图片显示是蓝色和灰色的,这不是我们所想要的效果。如果想显示自定义的按下和弹起的图片效果,这个时候就需要对TabBarItem进行修改。以下就是具体的示例:varitemNameArray:[String]=["down_32","add_32","plane_32","circle_32"]varitemNameSelectArray:[String]=["down_click_32","add_click_32"

  3. swift 2.0 类中的计算属性 & 只读属性

    classCircle{varpoint:varradius:Float//计算属性varperimeter:Float{get{returnFloat}set{print}}//构造函数。init{self.point=pointself.radius=radius;}}varcircle=Circle//我们拿到内部的一个计算属性的值,并打印print//这里感觉是给这个计算属性赋值的感觉,但是其实,我们只是走了这个计算属性内部的一个setter方法,虽然走了这个方法,但是perimeter并不会自动

  4. 23、swift开发iOS——继承

    Swift继承继承我们可以理解为一个类获取了另外一个类的方法和属性。为了指明某个类的超类,将超类名写在子类名的后面,用冒号(:)分隔,语法格式如下classSomeClass:SomeSuperclass{//类的定义}实例以下实例中我们定义了超类StudDetails,然后使用子类Tom继承它:classStudDetails{varmark1:Int;varmark2:Int;init{mark1=stm1;mark2=stm2;}funcshow(){print}}classTom:StudDeta

  5. python利用scatter绘画散点图

    这篇文章主要介绍了python利用scatter绘画散点图,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下,希望对你的学习有所帮助

  6. Python数据分析之 Matplotlib 散点图绘制

    这篇文章主要介绍了Python数据分析之 Matplotlib 散点图绘制,散点图又称散点图,是使用多个坐标点的分布反映数据点分布规律、数据关联关系的图表,下文对散点图的详细介绍及绘制,需要的小伙伴可以参考以一下

  7. D3.js(v3)+react 实现带坐标与比例尺的散点图 (V3版本)

    散点图(Scatter Chart),通常是一横一竖两个坐标轴,数据是一组二维坐标,分别对应两个坐标轴,与坐标轴对应的地方打上点。由此可以猜到,需要的元素包括circle(圆)和axis(坐标轴),接下来通过本文大家分享D3.js(v3)+react 实现带坐标与比例尺的散点图 (V3版本) ,一起看看

  8. Vue使用echarts散点图在区域内标点

    这篇文章主要为大家详细介绍了Vue使用echarts散点图在区域内标点,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  9. Python中Matplotlib的点、线形状、颜色以及绘制散点图

    与线型图类似的是,散点图也是一个个点集构成的,下面这篇文章主要给大家介绍了关于Python中Matplotlib的点、线形状、颜色以及绘制散点图的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下

  10. Python读取excel文件中的数据,绘制折线图及散点图

    这篇文章主要介绍了Python读取excel文件中的数据,绘制折线图及散点图,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部