小编and*_*atz的帖子

d3.js在鼠标悬停时改变线图点上的颜色和大小

我用d3.js制作了一个折线图(见附图1).

当鼠标悬停时,我设法在图形点上插入工具提示.我也想改变点的颜色和大小.我试过很多方面,但看起来真的很难.有帮助吗?这是一段代码:

  svg.selectAll("dot")    
    .data(data)         
    .enter().append("circle")                               
    .attr("r", 5.5)
    .style("fill", "#fff8ee")    
       .style("opacity", .8)      // set the element opacity
.style("stroke", "#f93")    // set the line colour
 .style("stroke-width", 3.5) 
    .attr("cx", function(d) { return x(d.date); })       
    .attr("cy", function(d) { return y(d.close); })     
    .on("mouseover", function(d) {   

        div.transition()        
            .duration(70)      
            .style("opacity", .7)

             ;      
        div .html(formatTime(d.date) + "<br/>"  + d.close)  
            .style("left", (d3.event.pageX) + "px")     
            .style("top", (d3.event.pageY - 28) + "px");    
        })                  
    .on("mouseout", function(d) {       
        div.transition()        
            .duration(200)      
            .style("opacity", 0);   
    });
Run Code Online (Sandbox Code Playgroud)

javascript jquery data-visualization d3.js

13
推荐指数
2
解决办法
3万
查看次数

mapbox.js:设置地图限制范围

我正在使用mapbox.js处理地图,但我想设置一个限制来映射边界和缩放.我要在这个脚本中添加什么代码?

var map = L.mapbox.map('map', 'examples.map-9ijuk24y').setView([40, -74.50], 9);
Run Code Online (Sandbox Code Playgroud)

javascript leaflet mapbox

9
推荐指数
1
解决办法
4881
查看次数

将字符字段转换为 R 中的季度日期

我有一个 tsv,其中有一个季度格式的日期字段(名为“trim”)

 trim
 1992-4
 1993-1
 ...
Run Code Online (Sandbox Code Playgroud)

当我将文件作为数据框加载时,R 将该字段作为字符导入。

我无法转换它,我只得到 NA,即使我尝试:

 df$trim <- as.Date(df$trim, format="%Y-%q")
Run Code Online (Sandbox Code Playgroud)

或加载动物园包并发送此命令:

as.yearqtr(df$trim, format="%Y-%q")
Run Code Online (Sandbox Code Playgroud)

任何的想法?

r

4
推荐指数
2
解决办法
4008
查看次数

无法在bootstrap div上插入d3图表

我需要使用bootstrap在HTML div上放置一个d3图表,但我不能.我设法把它贴在身上,但我不知道为什么我不能在div里面.我在脚本中使用这样的代码:

 var chart1 = d3.select("#chart1")
.append("svg")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height + margin.top + margin.bottom)
.append("g")
Run Code Online (Sandbox Code Playgroud)

和一个简单的方法:

  <div id="chartline1"></div>
Run Code Online (Sandbox Code Playgroud)

这是所有代码:

    <!DOCTYPE html>
            <html>
            <head>
        <title>Linee1</title>
            </head>

            <meta charset="utf-8">
            <body>
            <script type="text/javascript" src="d3/d3.js"></script>
            <script src="js/bootstrap.js"></script>
            <script src="js/jquery.min.js"></script>
            <link rel="stylesheet" href="css/style.css">

            <script>
            var margin = {top: 130, right: 40, bottom: 45, left: 150},
                width = 1000 - margin.left - margin.right,
        height = 505 - margin.top - margin.bottom;

            var parseDate = d3.time.format("%d-%b-%y").parse;


            var formatTime = d3.time.format("%e %B");

            var x …
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery d3.js

3
推荐指数
1
解决办法
7348
查看次数

标签 统计

javascript ×3

d3.js ×2

jquery ×2

css ×1

data-visualization ×1

html ×1

leaflet ×1

mapbox ×1

r ×1