此回复为自动发出,仅用于显示而已,并无任何其他特殊作用
楼主【Navymk】截止到2008-07-01 17:41:48的历史汇总数据(不包括此帖):
发帖数:18                 发帖分:1418               
结贴数:11                 结贴分:746                
未结数:7                  未结分:672                
结贴率:61.11 %            结分率:52.61 %            
楼主加油

解决方案 »

  1.   

    不是扯大旗做虎皮,但我有心把这个框架作为csdn.javascript的产品推出来,所以我期待这个事情,不是我一个人在战斗,这对我们这版也是有利的事情.
      

  2.   

    关于纯图形类,我更倾向于flash,不管是效率还是可用性。图形在js里,只能算是辅助~
    当然,楼主能写出来就很好,也许很多象我这样想法的人会因此而改变这样的想法。最重要的是能够学习到一些东西。对自己还有以后做这行的人都有借鉴和学习的作用。
      

  3.   

    加入到 jQuery UI 开发中去. 为什么要自己拉杆大旗?
      

  4.   

    我也是半路出家学的js,玩js也没有几天水平有限。想参与但想想可能也做不了什么。现在网上js的类库不少
    但真正有用的不多大部分是一些锦上添花的特效什么的,而象绘图等这些有用类库却很少,所以从心底里支持楼主的想法,当然我水平有限可能帮不上什么。前两天公司让座一个demo需要画折线图,从网上查了半天也没有什么好的解决方案大部分使用vml来做的,可现在已经不是ie一统天下的时代了,没办法自己写了个凑合应付,但感觉效率太低了,今后遇到这种需求考虑用flash<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style type="text/css">
    body{
    maring:0px 0px 0px 0px;
    }/*象素点*/
    .div-point{
    position:absolute;
    height:1px;
    width:1px;
    font-size:1px;
    background:#000000;
    overflow:hidden;
    z-index:1px;
    }
    /*折线点*/
    .div-pointNode{
    position:absolute;
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
    z-index:2;
    cursor:pointer;
    }
    </style>
    <script>
    /**
    *绘制折现函数
    *@param {html.div}oDivOut     画板Div
    *@param {Array}arrNodes       点集合
    *@param {int}nLSize           线宽
    *@param {String}sLColor       线色
    *@param {int}nPSize           点宽
    *@param {String}sPColor       点色
    **/
    function drawLinePath(oDivOut,arrNodes,nLSize,sLColor,nPSize,sPColor){
    for(var i=0,nLen=arrNodes.length;i<nLen-1;i++){
    lineTo(
    oDivOut,
    arrNodes[i].x,
    arrNodes[i].y,
    arrNodes[i+1].x,
    arrNodes[i+1].y,
    nLSize,
    sLColor); drawPointNode(
    oDivOut,
    arrNodes[i].x,
    arrNodes[i].y,
    nPSize,
    sPColor);
    }

    drawPointNode(
    oDivOut,
    arrNodes[i].x,
    arrNodes[i].y,
    nPSize,
    sPColor);
    }
    /**
    *画线函数
    *@param {html.div}oDivOut  画板div
    *@param {int}x1            起始X坐标
    *@param {int}y1            起始Y坐标
    *@param {int}x2            终点X坐标
    *@param {int}y2            终点Y坐标
    *@param {int}nWidth        线宽(可选)
    *@param {String}sColor     线颜色(可选)
    */
    function lineTo(oDivOut,x1,y1,x2,y2,nWidth,sColor){
    var slope,diff,direct;
    direct=Math.abs(x2-x1)>Math.abs(y2-y1)?"x":"y";
    if(x1==x2){//画垂直线
    diff=x2-x1;
    var temp=y2-y1;
    if(temp>0){
    for(var i=0;i<temp;i++){
    makedot(oDivOut,x1,y1+i,nWidth,sColor);
    }
    }else{
    for(var i=0;i>temp;i--){
    makedot(oDivOut,x1,y1+i,nWidth,sColor);
    }
    }
    }else if(direct=="x"){
    slope=(y2-y1)/(x2-x1);
    diff=x2-x1;
    if(x1<x2){
    for(var i=0;i<diff;i++){
    makedot(oDivOut,x1+i,y1+slope*i,nWidth,sColor);
    }
    }else{
    for(var i=0;i>diff;i--){
    makedot(oDivOut,x1+i,y1+slope*i,nWidth,sColor);
    }
    }
    }else if(direct=="y"){
    diff=y2-y1;
    slope=(x2-x1)/(y2-y1);
    if(y1<y2){
    for(var i=0;i<diff;i++){
    makedot(oDivOut,x1+slope*i,y1+i,nWidth,sColor);
    }
    }else{
    for(var i=0;i>diff;i--){
    makedot(oDivOut,x1+slope*i,y1+i,nWidth,sColor);
    }
    }
    }
    }/**
    *画折线点函数
    *@param {html.div}oDivOut     画板Div
    *@param {int}x                x坐标
    *@param {int}y                y坐标
    *@param {int}nSize            点宽
    *@parm  {Stirng}sColor        点色
    *@param {String}sTitle        title
    *@param {Object}oAttribs      其他属性
    **/
    function drawPointNode(oDivOut,x,y,nSize,sColor){
    var oDivNode=document.createElement("div");
    var _nSize=nSize?nSize:6;
    var _r=Math.round(_nSize/2);
    document.all?oDivNode.className="div-pointNode"
                :oDivNode.setAttribute("class","div-pointNode");
    oDivNode.style.color=sColor?"#"+sColor:"#0000ff";
    oDivNode.style.fontSize=_nSize+"px";
    oDivNode.style.height=_nSize+"px";
    oDivNode.style.width=_nSize+"px";
    oDivNode.style.left=(x-_r)+"px";
    oDivNode.style.top=(y-_r)+"px";
    oDivNode.innerHTML="●";
    oDivOut.appendChild(oDivNode);
    }/**
    *画点函数
    *@param {html.div}oDivOut  画板div
    *@param {int}x             X坐标
    *@param {int}y             Y坐标
    *@param {int}nWidth        线宽(可选)
    *@param {String}sColor     线颜色(可选)
    **/
    function makedot(oDivOut,x,y,nWidth,sColor){
    var oDiv=document.createElement("div");
    document.all?oDiv.className="div-point":
                 oDiv.setAttribute("class","div-point");
    oDiv.style.left=x+"px";
    oDiv.style.top=y+"px";
    oDiv.style.width=nWidth?nWidth+"px":"1px";
        oDiv.style.background=sColor?"#"+sColor:"#000000";
    oDivOut.appendChild(oDiv);  
    }function $(strId){
    return document.getElementById(strId);
    }window.onload=function(){
    var arrayNodes=[
    {x:10,y:10},
    {x:30,y:25},
    {x:50,y:40},
    {x:70,y:70},
    {x:90,y:20},
    {x:110,y:140},
    {x:130,y:67},
    {x:150,y:90},
    {x:170,y:120},
    {x:190,y:220},
    {x:210,y:150}
    ];

    drawLinePath($("div1"),arrayNodes,2,"339966",10,"ff0000");
    }
    </script>
    </head>
    <body>
        <div id="div1" style="width:300px;height:300px;
                              border:1px solid red;
                              position:absolute;
                              left:10px;top:10px;">
        </div>
    </body>
    </html>
      

  5.   

    flash吧,学as
    或者silvelight?
      

  6.   

    不是自己拉旗 我是奇怪csdn怎么没有自己的大旗
      

  7.   

    我建议使用flash做一个壳,然后通过js传递参数,这样无论效率还是效果还有兼容性都是最好的,其实做flash也不难,不知道有没有人肯做了。
      

  8.   

    有意,
    Email:[email protected]
      

  9.   

    英雄所见略同,正准备学呢,从网上找了一个AnyChart就是那样做的很喜欢打算也按照这种模式来
      

  10.   

    LZ08年就有这想法,膜拜~现在我也不知道那些图形JS好用!
    2年了,LZ的项目怎么样了?