cindyjs我如何在2个细分点之间设置函数

时间:2018-11-26 23:12:35

标签: javascript html5-canvas cindyjs

我无法弄清楚如何使用thats cindyjs脚本在2个点之间创建函数(右侧的第二个图形是点 {1} v {m_ {i}和< em> {2} v {m_ {i})或P1 [您可以选择其中一个],它们绑定在其他2条线t_1和t_2上,或者在空间上没有单个点。我试图弄清楚如何用矩阵来处理它,例如58_Interpolation.html,但这是我的第一次,因此我在这里向您询问解决方案。我需要对数和指数函数,例如log(x),exp(x)或该点之间的常规sin(x)+ cos(x)函数,其中起点和终点必须是直线上的2个点或第二个空间免费。哦,至少。对于所有其他民族。多数民众赞成在一个完整的功能图。如有需要,请接受:)寻求帮助

<div id="CSCanvas" style="width:1600px; height:600px; border:2px solid #000000"></div>
<script id="csmove" type="text/x-cindyscript">


m=[
  [1,1,1,1,0,0,0,0,0,0,0,0],
  [8,4,2,1,0,0,0,0,0,0,0,0],
  [0,0,0,0,8,4,2,1,0,0,0,0],
  [0,0,0,0,27,9,3,1,0,0,0,0],
  [0,0,0,0,0,0,0,0,27,9,3,1],
  [0,0,0,0,0,0,0,0,64,16,4,1],
  [3,2,1,0,0,0,0,0,0,0,0,0],
  [12,4,1,0,-12,-4,-1,0,0,0,0,0],
  [0,0,0,0,27,6,1,0,-27,-6,-1,0],
  [0,0,0,0,0,0,0,0,48,8,1,0],
  [12,2,0,0,-12,-2,0,0,0,0,0,0],
  [0,0,0,0,18,2,0,0,-18,-2,0,0]
  ];
v=[v_mi2.y,v_mi2_B.y];
a=linearsolve[m,v];
plot[x^3*a_1+x^2*a_2+x*a_3+a_4,start->1,stop->2,size->3];
</script>


<script type="text/javascript">
//Visueller Bereich des Graphen verändern
graph_l = 4.8, graph_t = 2, graph_r = 1, graph_b = -0.4;
//grid | Vorsicht, da auch andere Segmente des Programms dadurch betroffen sind!
grid_value = .2;
//Multiplikationsfaktoren
  //graph_f = um die Verschiebung vom graph_x Wert einheitlich zu gestalten
  //tx_f    = Verschiebungsfaktor für alle tx->tx' | ts_f = Verschiebungsfaktor Trennsegment
  //B_xy    = Multiplikationsfaktor für Beschriftung 1 - 0.1, B_xy > 0
  //N_mi_y  = Abnahmefunktion für zb: Masse, etc., was später durch eine ordentliche Formelstruktur geändert werden soll
  //anfc    = Abnahmefunktionskoeffizient, was später durch eine ordentliche Formel geändert werden soll
graph_f = 0.9;  tx_f = 3;   ts_f = 1.2;   B_xy = 0.3;   anfc = 0.9;
N_mi_y    = (graph_t*graph_f)*0.9;  N_mi_y_factor   = 0.95;
N_v_mi_y  = (graph_t*graph_f)*0.85; N_v_mi_y_factor = 0.9;
//Beschriftung links unten|links oben|rechts unten|rechts oben neben dem Punkt
B_lu_x = -grid_value*B_xy;      B_lu_y = -grid_value*B_xy*2;
B_lo_x = -grid_value*B_xy;      B_lo_y = grid_value*B_xy*0.1;
B_ru_x = grid_value*B_xy*0.1;   B_ru_y = -grid_value*B_xy*1.5;
B_ro_x = grid_value*B_xy;       B_ro_y = grid_value*B_xy;
//Graphen komplett verschieben/Startpunkt setzen
N_x = 0; N_y = 0; N_z = 1;
//Diverses

var gslp=[
  //--
  // P...Punkt, T...Trennlinie, TnxyS...TrennlinienSegment
  //Diagramm 1
  {name:"P0",    pos:[ N_x, N_y, N_z ],type:"Free",pinned:"true",labeled:"",size:"0"},
  {name:"P0_txt",pos:[ N_x+B_lu_x, N_y+B_lu_y, N_z ],printname:"$0$",pinned:"true",type:"Free",labeled:"true",size:"0"},
  {name:"Px",    pos:[ (graph_r*graph_f)+N_x, N_y, N_z ],type:"Free",pinned:"true",labeled:"",size:"0"},
  {name:"Px_txt",pos:[ (graph_r*graph_f)+N_x+B_ru_x, N_y+B_ru_y, N_z ],printname:"$x$",type:"Free",pinned:"true",labeled:"true",size:"0"},
  {name:"Py",    pos:[ N_x, (graph_t*graph_f)+N_y, N_z ],type:"Free",pinned:"true",labeled:"",size:"0"},
  {name:"Py_txt",pos:[ N_x+B_lo_x, (graph_t*graph_f)+N_y+B_lo_y, N_z ],printname:"$y$",type:"Free",pinned:"true",labeled:"true",size:"0"},
  {name:"P0Px",  type:"Segment",args:["P0","Px"],arrow:"true",arrowshape:"full" },
  {name:"P0Py",  type:"Segment",args:["P0","Py"],arrow:"true",arrowshape:"full" },
  {name:"t0t1",  pos:[ (graph_r*graph_f/tx_f)+N_x, N_y+B_lu_y, N_z ],printname:"$t_{0} \\rightarrow t_{1}$",type:"Free",pinned:"true",labeled:"true",size:"0"},
  //Trennsegment 1
 {name:"Txy1", pos:[ (graph_r*graph_f/ts_f)+N_x, (graph_t*graph_f)+N_y, N_z ],type:"Free",pinned:"true",labeled:"",size:"1"},
  {name:"TS1",  pos:[ (graph_r*graph_f/ts_f)+N_x, N_y+N_mi_y ,N_z ],type:"PointOnSegment",args:["P0Px"],pinned:"true",labeled:"",size:"1"},
  {name:"TS1_1",type:"Segment",args:["Txy1","TS1"],dashtype:"1"},
  //m_i
  {name:"mi",   pos:[ N_x, N_y+N_mi_y, N_z ],printname:"$m_{i}$",type:"PointOnSegment",args:["P0Py"],labeled:"true",size:"2"},
  {name:"mi_2", pos:[ N_x, N_y+N_mi_y*N_mi_y_factor, N_z ],printname:"$_{1}m_{i}$",type:"PointOnSegment",args:["TS1_1"],labeled:"true",size:"2"},
  {name:"S1",   type:"Segment",args:["mi","mi_2"],color:[0,0,1]},
  //v_m_i
  {name:"v_mi",  pos:[ N_x, N_y+N_v_mi_y, N_z ],printname:"$v_{m_{i}}$",type:"PointOnSegment",args:["P0Py"],size:"2",labeled:"true"},
  {name:"v_mi_2",pos:[ N_x, N_y+N_v_mi_y*N_v_mi_y_factor, N_z ],printname:"$_{1}v_{m_{i}}$",type:"PointOnSegment",args:["TS1_1"],size:"2",labeled:"true"},
  {name:"S1_2",  type:"Segment", args:["v_mi","v_mi_2"], color:[0,0,1]},
  //arrows
  {name:"a1",        pos:[ (graph_r*graph_f/ts_f)+N_x, N_y-grid_value, N_z ],type:"Free",labeled:"",size:"0"},
  {name:"a1_2",      type:"Segment", args:["a1","TS1"],arrow:"true",arrowshape:"full" },
  {name:"a1_3",      pos:[ (2*graph_r*graph_f-(graph_r*graph_f/ts_f))+N_x, N_y-grid_value, N_z ],type:"Free",labeled:"",size: "0"},
  {name:"a1_4",      type:"Segment", args:["a1","a1_3"],arrow:"true",arrowshape:"full" },
  {name:"a1_4r",     pos:[ (2*graph_r*graph_f-(graph_r*graph_f/ts_f))+graph_r*graph_f+N_x, N_y-grid_value, N_z ],type:"Free",labeled:"",size: "0"},
  {name:"a1_5",      type:"Segment", args:["a1_3","a1_4r"],arrow:"",arrowshape:"", dashtype:"3" },
  {name:"a1_4r_up",  pos:[ (2*graph_r*graph_f-(graph_r*graph_f/ts_f))+graph_r*graph_f+N_x, N_y-grid_value+(graph_t*graph_f)+1.6*grid_value, N_z ],type:"Free",labeled:"",size: "0"},
  {name:"a1_6",      type:"Segment", args:["a1_4r","a1_4r_up"],arrow:"",arrowshape:"", dashtype:"3" },
  {name:"a1_5l_up",  pos:[ (2*graph_r*graph_f-(graph_r*graph_f/ts_f))+N_x, N_y-grid_value+(graph_t*graph_f)+1.6*grid_value, N_z ],type:"Free",labeled:"",size:"0"},
  {name:"a1_8",      type:"Segment", args:["a1_4r_up","a1_5l_up"],arrow:"",arrowshape:"", dashtype:"3" },
  {name:"a1_to_a1_3",type:"Segment", args:["a1_3","a1_5l_up"],arrow:"",arrowshape:"", dashtype:"3" },

  //Diagramm 2
  {name:"P1",     pos:[ (2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))+N_x, N_y, N_z ],type:"Free",pinned:"true",labeled:"",size:"0"},
  {name:"P1_txt", pos:[ (2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))+N_x+B_lu_x, N_y+B_lu_y, N_z ],printname:"$t_{1}$",pinned:"true",type:"Free",labeled:"true",size:"0"},
  {name:"Px1",    pos:[ (2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))+graph_r*graph_f+N_x, N_y, N_z ],type:"Free",pinned:"true",labeled:"",size:"0"},
  {name:"Px1_txt",pos:[ (2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))+graph_r*graph_f+N_x+B_ru_x, N_y+B_ru_y, N_z ],printname:"$x$",type:"Free",pinned:"true",labeled:"true",size:"0"},
  {name:"Py1",    pos:[ (2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))+N_x, (graph_t*graph_f)+N_y, N_z ],type:"Free",pinned:"true",labeled:"",size:"0"},
  {name:"Py1_txt",pos:[ (2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))+N_x+B_lo_x, (graph_t*graph_f)+N_y+B_lo_y, N_z ],printname:"$y$",type:"Free",pinned:"true",labeled:"true",size:"0"},
  {name:"P1Px1",  type:"Segment",args:["P1","Px1"],arrow:"true",arrowshape:"full" },
  {name:"P1Py1",  type:"Segment",args:["P1","Py1"],arrow:"true",arrowshape:"full" },
  //{name:"t1t2",   pos:[ (2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))+(graph_r*graph_f/tx_f)+N_x, N_y+B_lu_y, N_z ],printname:"$t_{1} \\rightarrow t_{2}$",type:"Free",pinned:"true",labeled:"true",size:"0"},
    //Vereinfacht
  {name:"t1t2",   pos:[ graph_r*graph_f*(2.1-(1/ts_f)+(1/tx_f))+N_x, N_y+B_lu_y, N_z ],printname:"$t_{1} \\rightarrow t_{2}$",type:"Free",pinned:"true",labeled:"true",size:"0"},
  //Trennsegment 2
  {name:"Txy_2",pos:[ ((2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))/ts_f)+graph_r*graph_f+N_x, (graph_t*graph_f)+N_y, N_z ],type:"Free",pinned:"true",labeled:"",size:"0"},
  {name:"TS2",  pos:[ ((2.1*graph_r*graph_f-(graph_r*graph_f/ts_f))/ts_f)+graph_r*graph_f+N_x, N_y, N_z ],type:"PointOnSegment",args:["P1Px1"],pinned:"true",labeled:"",size:"0"},
  {name:"TS2_2",type:"Segment",args:["Txy_2","TS2"],dashtype:"1"},
  //(1)_mi und (2)_mi
  {name:"mi2",  pos:[ graph_r*graph_f*(2.1-(1/ts_f)+1)+N_x, N_y+N_mi_y*N_mi_y_factor, N_z ],printname:"$_{1}{m_{i}}$",type:"PointOnSegment",args:["P1Py1"],size:"2",labeled:"true"},
  {name:"mi2_2",pos:[ graph_r*graph_f*(2.1-(1/ts_f)+1)+N_x, N_y+N_mi_y*(N_mi_y_factor*anfc), N_z ],printname:"$_{2}{m_{i}}$",type:"PointOnSegment",args:["TS2_2"],size:"2",labeled:"true"},
  {name:"S2",   type:"Segment",args:["mi2","mi2_2"],color:[0,0,1],dashtype:"0" },
  //(1)_v_m_i und (2)_mi
  {name:"v_mi2",  pos:[ graph_r*graph_f*(2.1-(1/ts_f)+1)+N_x, N_y+N_v_mi_y*N_v_mi_y_factor, N_z ],printname:"$_{1}v_{m_{i}}$",type:"PointOnSegment",args:["P1Py1"],size:"2",labeled:"true"},
  {name:"v_mi2_2",pos:[ graph_r*graph_f*(2.1-(1/ts_f)+1)+N_x, N_y, N_z ],printname:"$_{2}v_{m_{i}}$",type:"PointOnSegment",args:["TS2_2"],size:"2",labeled:"true"},
  {name:"v_mi2_B",pos:[ graph_r*graph_f*(2.1-(1/ts_f))*1.2+N_x, (graph_t*graph_f*0.7)+N_y, N_z ],printname:"P1",type:"Free",size:"2",labeled:"true"},
  //{name:"S2_2",   type:"Segment",args:["v_mi2","v_mi2_2"],color:[0,0,1],dashtype:"0" },
  ];

  CindyJS({
    canvasname:"CSCanvas",
    defaultAppearance: { fontFamily: "sans-serif", lineSize: 1,     pointSize: 5.0 },
    //defaultAppearance: {},
    scripts: "cs*",
    movescript: "csmove",
    geometry: gslp,
    //use: ["CindyGL", "katex"],
    use: ["katex"],
    //axes: true,
    grid:grid_value,
    //snap:true,
    transform: [{
      //left, top, right and bottom
      //visibleRect: [ 4, 1, -1, -1]
      visibleRect: [ graph_l, graph_t, graph_r, graph_b ]
    }]
  });
</script>

1 个答案:

答案 0 :(得分:0)

我认为您正在寻找https://doc.cinderella.de/tiki-index.php?page=Function+Plotting中记录的start函数的stopplot修饰符。